Javascript 如何使用Laravel Mix将lodash debounce添加到我的项目中

我是新来使用拉维混合和纱线（来自Codekit），所以请容忍我！我的项目中有我的

webpack.mix.js

文件，如下所示：

const mix = require('laravel-mix');
const tailwindcss = require('tailwindcss');
const purgeCss = require('laravel-mix-purgecss');

mix.postCss('./source/styles/styles.css', './public/assets/css/', [
  tailwindcss('./tailwind.js'),
]);

mix.scripts([
    './source/scripts/app.js',
], './public/assets/js/app.js');

mix.copyDirectory('./source/fonts', './public/assets/fonts');

mix.copy('./source/images/', './public/assets/img/');

mix.copy('./source/root_files/', './public/');

mix.purgeCss({
  enabled: true,
  globs: [
    path.join(__dirname, './public/*.html'),
    path.join(__dirname, './public/assets/*.js'),
  ],
  extensions: ['html', 'js', 'php'],
});

mix.browserSync({
  proxy: 'something.loc',
  files: [ './public/*.html', './public/assets/**/*.*' ]
});

这是目前工作良好，做我想做的一切

现在我想添加

lodash.debounce

和

lodash.throttle

，这样我就可以在我的

app.js

文件中使用这些函数了。我已使用

纱线添加

将它们添加到我的项目中，它们位于我的

节点模块

文件夹中

我的问题是我接下来要做什么？我尝试从

节点_modules

文件夹添加

index.js

文件，如下所示：

mix.scripts([
    './node_modules/lodash.debounce/index.js',
    './source/scripts/app.js',
], './public/assets/js/app.js');

这是使用

Thread dev

构建的，但是在我的页面上出现了一个控制台错误：

ReferenceError:module未定义

我不熟悉这种工作方式，所以这可能是显而易见的，谢谢你的帮助

更新

我现在尝试在我的

webpack.mix.js

文件中使用以下内容：

mix.js('./source/scripts/app.js', './public/assets/js/app.js');

const debounce = require('lodash.debounce');
const throttle = require('lodash.throttle');

window.onresize = _.debounce(() => {
  console.log('resized!')
}, 100)

并将其添加到我的

/source/scripts/app.js

文件中：

mix.js('./source/scripts/app.js', './public/assets/js/app.js');

const debounce = require('lodash.debounce');
const throttle = require('lodash.throttle');

window.onresize = _.debounce(() => {
  console.log('resized!')
}, 100)

构建并打开控制台时，出现以下错误：

ReferenceError: _ is not defined

---

您应该在

source/scripts/app.js

文件中使用

require

。对于通过Thread添加的任何JavaScript模块，通常都应该这样做

// source/scripts/app.js
const debounce = require('lodash.debounce');
const throttle = require('lodash.throttle');

---

您得到的是告诉

laravelmix

您的应用程序有两个入口点。当它试图将这些文件转换为单个捆绑包时，它不知道如何处理lodash Dependency中的module.exports语句，因此它将其留在那里，从而导致浏览器控制台错误

嗨，本杰明，谢谢你的回答。请查看我在上面的编辑，以及我根据您的回复所做的尝试-它仍然不起作用，因为我希望将您的debounce调用更改为：`window.onresize=debounce（（）=>{console.log（'resized！'）}，100）`因为这就是您导入它的目的