Webpack просто склеить файлы
Осваиваю вебпак, но сейчас вместо каких-то сложных манипуляций мне нужно просто собрать несколько файлов в один и тут начались сложности. Есть на работе сервис, которому надо подсовывать js скрипты, но там не поддерживается импорт, а у меня там много скриптов и приходится дублировать везде один и тот же код, а уж его обновление превращается в муку.
Я подумал, что у себя создам репозиторий, где буду хранить все скрипты, а в них необходымые утилиты будут по нормальному переиспользоваться через import из соседней папки. А когда мне надо будет залить скрипт в сервис на продакшн я все его импорты автоматически соберу вебпаком в один файл, который и отправлю в сервис.
Но тут начались нюансы. Во первых у меня много скриптов и для каждого прописыать вручную точку входа как-то не очень, поэтому автоматизировал через glob. Затем оказалось, что вебпак автоматически минифицирует код. Нашел как отключить (optimization: inimize: false). Затем в скомпилированных файлах обнаружил какой-то код вебпака, закомментированный вначале как webpackBootstrap, нашел как отключить (runtimeChunk: true). Но теперь все ещё в выходных файлах остаётся какой-то код, добавленный вебпаком
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[0],[
/* 0 */,
/* 1 */
/***/ (function(module, exports) {
Как ни пытался его убрать, не получается (максимум, это получалось его сократить если target: 'node'). Мне нужны просто склееные файлы на выходе - каждый файл по отдельности, но внутри с кодом импортов, без лишнего. Может кто помочь? Вот настройки вебпака
const path = require("path");
const glob = require("glob");
const webpack = require("webpack");
module.exports = {
entry: glob.sync('./scripts/*.js').reduce((acc, path) => {
const entry = path.replace('.js', '').replace('scripts/', '')
acc[entry] = path
return acc
}, {}),
output: {
path: path.resolve(__dirname, "dist"),
filename: "[name].js",
},
optimization: {
minimize: false,
runtimeChunk: true,
}
};