前言：npm 是一个非常流行的 JavaScript 包管理器，而 laravel-js 是一个针对 Laravel 5.x 和 6.x 的可复用 JavaScript 资源管理器。在本文中，我们将详细介绍如何使用 npm 包 laravel-js，并提供代码示例来展示其使用方式。
什么是 laravel-js
Laravel-js 是一个可复用 JavaScript 资源管理器，他为 Laravel 应用程序提供了一种统一的 JavaScript 资源组织方式。他可以轻松管理所有 JavaScript 资源，并使用 Laravel 的 Blade 模板引擎输出这些资源，从而实现 JavaScript 资源的像 Laravel 视图那样的统一管理。
安装
首先，您需要在项目中安装 laravel-js。您可以使用 npm 来安装它：
npm install laravel-js --save-dev
安装完成后，将自动为您的项目添加一个 node_modules 目录，其中将包含 laravel-js 包。
使用
laravel-js 非常容易使用。要使用它，您只需要在视图中包含 laravel-js 所提供的 JavaScript 资源标签。下面是一个基本的示例：
-- -------------------- ---- -------
--------- -----
------
------
----------------- ---------------
-------
------
---- ------------------
-----------------
------
------- ------- -------------------- -------------
-------
-------在上面的这个示例中，我们使用 @yield 指令，模仿 Laravel 视图中的布局。
然后，在脚本标签中，我们使用了一个函数 laravel_js，以输出 app.js 脚本。
并且您可以在 Laravel 视图组件中配合 [laravel-mix][laravel-mix] 使用，可以很方便地进行版本控制和压缩。
最后需要注意的是，laravel-js 给您提供了一种简便的方式，让您以相同的方式来管理不同的 JavaScript 资源，与 Laravel 视图中的 Blade 模板引擎使用方式一致。
示例代码
接下来，我们将使用一个实用的示例来展示 laravel-js 的使用方法。该示例将展示如何在 Laravel 视图中使用 laravel-js 包，同时还将演示如何使用 [axios][axios] 来发起 HTTP 请求，以从服务端获取数据，并将这些数据在视图中进行渲染。
下面的代码实现步骤如下：
- 引入 laravel-js 包。
- 在 .blade.php 视图文件中使用回传的数据。
- 在 app.js JavaScript 文件中使用 Axios 库发起 HTTP 请求，以获取数据。
- 渲染发送响应数据。
该代码演示了如何使用 laravel-js 包，以简化在 Laravel 视图中引入 JavaScript 资源的过程。
再次提醒，Laravel-js 还支持版本控制和压缩，这使得它成为一个非常有用且强大的 JavaScript 资源管理器。
server.js
-- -------------------- ---- -------
----- ------- - ------------------
----- --- - ---------
--------------- ----- ---- -- -
----------
-------- ------ ---- ---------
--
--
----------------example.blade.php
-- -------------------- ---- -------
--------- -----
------
------
----------------- ---------------
------- ------- -------------------- -------------
-------
------
---- ------------------
----------- -- ------------
---- ---------
-- -----------------------------
-- --------- ------- ------
------
------
-------
-------app.js
-- -------------------- ---- -------
-----------------------
------------------------ ---------------------------------------------
----- --- - --- -----
--- -------
----- -
-------- --------- ---------
-------- ----
--
--------- -
-----------------
-------------- -- -
------------ - ------
------------ - ----------------------
---
-
---components/Example.vue
-- -------------------- ---- -------
----------
-----
--------- ---------------
----
----- ------- ------
------
-----------
--------
-------------- - -
------ -
------ -
-------- ------ ------
-
-
-
---------结论
在本文中，我们学习了如何使用 npm 包 laravel-js，这是一个可以大大简化在 Laravel 视图中引用 JavaScript 资源的包。
通过使用 laravel-js 包，我们可以实现 JavaScript 资源的统一管理，从而大大简化前端开发，同时使代码结构更加清晰明了。本文展示的示例已经成功演示了如何使用 laravel-js 包，并在视图中渲染数据。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055b8881e8991b448d9269