npm 包 laravel-mix-jet 使用教程-JavaScript中文网-JavaScript教程资源分享门户

什么是 laravel-mix-jet

laravel-mix-jet 是基于 Laravel Mix 封装的一个前端工具库，它提供了一套简单易用的 API，让我们可以快速、方便地构建和打包前端资源文件。与 Laravel Mix 相比，laravel-mix-jet 更加注重在前端开发中的实际应用场景，集成了一些常用的工具和特性，如自动刷新、HMR、React、Vue 等。

如何安装 laravel-mix-jet

首先，我们需要安装 Node.js 环境，然后在命令行中执行以下命令进行安装：

npm install laravel-mix-jet --save-dev

安装成功后，我们还需要在 webpack.mix.js 文件中引入 laravel-mix-jet：

const mix = require('laravel-mix');
require('laravel-mix-jet');

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .jet(); // 引入 laravel-mix-jet

如何使用 laravel-mix-jet

laravel-mix-jet 提供了一系列简单易用的 API，通过这些 API，我们可以轻松地进行前端资源文件的构建和打包，比如：

自动刷新

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .jet(); // 开启自动刷新

HMR

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .jet({ hmr: true }); // 开启 HMR

React

mix.react('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .jet({ react: true }); // 开启 React

Vue

mix.vue('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .jet({ vue: true }); // 开启 Vue

自定义配置

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .jet({
      // 自定义配置
   });

总结

通过以上介绍，我们可以看出 laravel-mix-jet 的安装、配置、使用都非常简单，而且它还提供了一些便利的功能，在实际开发中可以节省我们很多时间和精力。相信通过学习使用 laravel-mix-jet，你也可以轻松成为一名优秀的前端开发者。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/64118