编译资源

未匹配的标注

编译资源 (Laravel Mix)

安装和设置

当你创建一个新模块时,它也会为 CSS/JS 和 webpack.mix.js 配置文件创建资源。

php artisan module:make Blog

进入该模块:

cd Modules/Blog

默认的 package. json 文件包含了开始使用所需要的一切。你可以通过运行以下命令来安装它引用的依赖:

npm install

运行 Mix

Mix是 Webpack 的上层配置,所以要运行你的Mix任务,你只需要执行其中一个 NPM 命令,它包含在默认的 laravel-modules package.json 文件中

// 运行所有Mix任务...
npm run dev

// 运行所有Mix任务并最小化输出...
npm run production

生成版本化文件后,你不会知道确切的文件名。因此,您应该在视图中使用Laravel的全局mix函数来加载适当的哈希资源。mix函数将自动确定散列后文件的当前名称:

// Modules/Blog/Resources/views/layouts/master.blade.php

<link rel="stylesheet" href="{{ mix('css/blog.css') }}">

<script src="{{ mix('js/blog.js') }}"></script>

有关Laravel Mix的更多信息,请查看文档:《Laravel 中文文档》

注意: 为了防止主Laravel Mix配置文件 public/mix-manifest.json 被覆盖:

安装 laravel-mix-merge-manifest

npm install laravel-mix-merge-manifest --save-dev

修改 webpack.mix.js 主文件

let mix = require('laravel-mix');


/* 允许多个Laravel Mix应用程序 */
require('laravel-mix-merge-manifest');
mix.mergeManifest();
/*----------------------------------------*/

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');

本文章首发在 LearnKu.com 网站上。

上一篇 下一篇
《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
讨论数量: 0
发起讨论 只看当前版本


暂无话题~