laravel 從 node_modules 中的包中混合編譯資產？

Question

我開始在我的新 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 導入/要求他們的 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 之類的任何其他軟件才能使事情發生？

Answer 1

對於 js 我只使用

import 'vue'
import 'cropperjs'

通常包文檔會告訴你如何導入它。

Answer 2

你不應該在 webpack.mix 中編譯節點資產......就像 barghouthi 說的，通常包文檔會告訴你如何在你的 js 文件中導入包。