Как добавить lodash debounce в мой проект с помощью Laravel Mix - PullRequest
Новая
       38

Как добавить lodash debounce в мой проект с помощью Laravel Mix

0 голосов
/ 07 марта 2019

Я новичок в использовании Laravel Mix и Yarn (из 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.Я добавил их обоих в свой проект, используя yarn add, и они есть в моей папке node_modules.

Мой вопрос: что мне делать дальше?Я попытался добавить файл index.js из папки node_modules следующим образом: 

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

Это сборка с использованием yarn dev, но затем я получаю консольную ошибку на своей странице: ReferenceError: module is not defined

Я новичок в этом способе работы, так что это, вероятно, что-то очевидное, спасибо за любую помощь!

ОБНОВЛЕНИЕ

Я попытался использовать следующеев моем webpack.mix.js файле: 

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

И добавил это в мой /source/scripts/app.js файл: 

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

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

Когда я собираю и открываю консоль, я получаю эту ошибку: 

ReferenceError: _ is not defined

1 Ответ

1 голос
/ 13 марта 2019

Вы должны использовать require внутри вашего source/scripts/app.js файла.Обычно это то, что вы должны делать для любых модулей JavaScript, добавляемых через Yarn. 

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

То, что вы получаете, говорит laravel-mix, что ваше приложение имеет две точки входа.Когда он пытается превратить эти файлы в один пакет, он не знает, что делать с оператором module.exports внутри зависимости lodash, поэтому он просто оставляет его там, отсюда и ошибка консоли браузера.

...