我是Webpack和Babel的新手，但我认为我已经非常了解如何使用它们，尽管仍有一件事我无法解决。
这是问题...基本上，我有3个javascript文件：
setup.js是链接到我的html页面的唯一文件，它包含一个轻量级脚本，动态插入一些所需的资源，包括loader.js
loader.js有点重，负责下载和插入所有剩余资源，基于一些逻辑，最后包括main.js，其中包含我的其余代码。
所以插入顺序是：setup.js - > loader.js - > main.js
我在Webpack中使用babel-loader来转换并填充这3个文件（使用@ babel / preset-env和core-js 3.0.0）
问题是，显然，我不想在这些文件中重复代码，也不希望我向上面指定的结构添加更多文件。
我目前正在将3个文件作为入口对象提供给Webpack，具有以下配置：
（注意：我动态生成Webpack配置，但对于这种情况，生成的简化对象将如下所示。）
{
entry: {
setup: 'path/to/setup.js',
loader: 'path/to/loader.js',
main: 'path/to/main.js',
},
mode: 'development',
output: {
filename: '[name].js',
path: 'output/path'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options: {
presets: [
[
'@babel/preset-env',
{
useBuiltIns: 'usage',
corejs: {
version: '3.0.0',
proposals: false
}
}
]
],
configFile: false,
babelrc: false
}
}
}
]
},
watch: false,
node: false,
optimization: {
splitChunks: {
chunks: 'all',
minSize: 0
}
}
}
通过这种配置，我设法有效地避免了重复，这是对默认配置的改进（没有自定义优化，每个文件获取其所需的模块，即使它们也包含在其他文件中），但我得到了单独文件中的模块：
我真正想要的是：
setup.js进行转换和polyfilled，然后是loader.js但是忽略已经插入setup.js的模块，最后是main.js但是再次忽略插入前两个文件中的模块。每个文件包含相应的模块（而不是在单独的文件中）
我的最后选择：
选项1：从图像中注意，如果供应商〜...文件按照上面指定的插入顺序重新合并到起始文件，并使用require-first策略，则会生成预期的输出。 （我不知道这些文件是否可以在没有进一步考虑的情况下进行残酷合并）。
选项2：我想将Babel与Webpack分开...使用Babel分别在每个文件中添加所有require语句。然后按顺序读取文件并删除重复的require语句。然后，将文件独立传递给Webpack。但我真的希望有一个更简单的选择！ （这个选项显然可以达成协议，但是不可能优化模块依赖关系分布（不同的模块可能有重复的常见依赖关系（？）），但我认为这是可以接受的（？））
我将不胜感激任何解决方案，建议或建议。
非常感谢您的宝贵时间！
经过几天深入研究Webpack的源代码，我得出结论，只使用Webpack包含的功能就无法实现这一点，所以我编写了一个完全满足我需求的插件。
你可以找到它HERE。以防万一将来对某人有用。