У меня есть сборка Gulp + Webpack. Последний обрабатывает только js-скрипты через webpack-stream При запуске в dev mode всё собирается и работает хорошо. При попытке запуска в production падает задача именно по обработке js. Путём отключения выяснил, что проблема в подключаемом слайдере spliderjs. Однако подключаю его, как указано спеке на сайте и не могу понять, почему падает сборка. Причём конфиги webpack-а простейшие!
Вот выдержка задачи из Gulp:
function js() {
return src("source/js/*.js")
.pipe(webpackStream(webpackConfig), webpack)
.pipe(dest("./dist/js"));
}
Вот команды для запуска dev или prod:
export const build = series(clean, copy, parallel(sprite, css, js), html); // npm run build
export default series(build, server); // npm run dev
И скрипты в package.json:
"scripts": {
"dev": "gulp",
"build": "set NODE_ENV=true && gulp build",
"clean": "gulp clean"
},
webpackConfig:
import path from "path";
import { fileURLToPath } from 'url';
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
export default {
entry: {
main: path.resolve(__dirname, "source/js/index.js"),
},
output: {
filename: '[name].bundle.js',
},
mode: process.env.NODE_ENV ? 'production' : 'development',
devtool: process.env.NODE_ENV ? false : "source-map",
target: ['web', 'es5'],
optimization: {
splitChunks: {
cacheGroups: {
splide: {
test: /[\\/]node_modules[\\/]/,
name: 'splide',
chunks: 'all',
},
},
},
chunkIds: 'named'
},
};
Файловая структура проекта:
Подключение библиотеки слайдера splidejs в модульный файл:
Подключение модуля splide.mjs в index.js, который является точкой входа для webpack:
При этом слайдер рабочий, всё подхватывается, но только в dev mode. Все версии node, gulp, webpack текущие. Подскажите, кто сталкивался с таким, как исправить. А, да, вот ошибка: