laravel mix 从 node_modules 中的包编译 Assets ​​？

Question

我开始在我的新 Laravel 5.7 项目上使用 laravel-mix 将所有 js/css 编译到一个文件中，该文件将出现在我的公共(public) 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();

像这样，我想保持 View 整洁并减少必须加载的资源数量。

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

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

对于 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 安装的软件包时有什么好的做法？

我必须将整个包目录放入我的公共(public)目录中吗？ 我是否链接到位于node_modules 目录中的包目录中的 Assets ？ 或者他们是否有机会通过 laravel-mix/webpack 将它们与我的其他 Assets 一起编译，也许我缺少一个标志等等？ 我是否必须使用任何其他软件(例如 Bower)才能实现这些目的？

Answer 1

对于js我只使用

import 'vue'
import 'cropperjs'

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