laravel mix 从 node_modules 的包中编译资产？答案

【问题标题】：laravel mix compile assets from a package in node_modules?laravel mix 从 node_modules 的包中编译资产？
【发布时间】：2019-04-06 23:51:31
【问题描述】：

我开始在我的新 Laravel 5.7 项目中使用 laravel-mix 将所有 js/css 编译到一个文件中，该文件将出现在我的公共 js/css 目录中（每页一个），如下所示：

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .js('resources/js/create.member.js', 'public/js/backend/members')
   .sass('resources/sass/create.member.scss', 'public/css/backend/members')
   .sourceMaps();

像这样我想保持视图整洁并减少必须加载的资产数量。

到目前为止一切都很好，我了解如何使用 laravel-mix。现在我通过 npm 将一些包，特别是cropperjs 和summernote 安装到了我的node_modules 目录中。

当我将它们的 scss/js 导入/要求它们到将由 laravel-mix 编译并公开发布的脚本时失败，因为似乎这些脚本（cropper.js、summernote.scss 等... ) 在 node_modules 目录中的原始包目录中引用其他资产（字体、图像等...）

对于 JS 我做：

require('../../node_modules/cropperjs/dist/cropper.js');
require('../../node_modules/summernote/dist/summernote.js');

我为 SCSS 做的：

@import '~cropperjs/src/css/cropper';
@import '~summernote/src/less/summernote-bs4';

我的问题是：使用 npm 安装的包时有什么好的做法？

我是否必须将整个包目录放到我的公共目录中？我是否链接到位于 node_modules 目录中的包目录中的资产？或者他们是否有机会通过 laravel-mix/webpack 将它们与我的其他资产一起编译，也许是我缺少的标志？我是否必须使用任何其他软件（如 bower）才能使事情发生？

【问题讨论】：

标签： laravel webpack assets npm-install laravel-mix

【解决方案1】：

对于js我只用

import 'vue'
import 'cropperjs'

通常包文档会告诉你如何导入它。

【讨论】：

如何导入 CSS 文件？我已经发布了这个question。

【解决方案2】：

你不应该在 webpack.mix 中编译节点资产...就像 barghouthi 说的，通常包文档会告诉你如何在你的 js 文件中导入包。

【讨论】：