Webpack:如何将多个javascript文件捆绑到一个输出文件中？

Question

假设我有两个文件,main.js和app.js ; 我如何使用Webpack将它们捆绑到一个文件中:bundle.js？

Answer 1

创建一个entry.js是您的webpack条目文件,并在其中创建您require的附加文件

webpack.config.js

module.exports = {
   entry: './src/entry.js'
   ...
};

/src/entry.js

require('./main.js');
require('./app.js');

如果这两个文件相互依赖,那么在您的依赖关系树中反映这个并且需要main.js在您的app.js而不是entry.js例如

我有一个文件夹，其中包含 15 个第三方 js 文件（jQuery 插件或 javascript 库），我想将这些文件捆绑到一个文件中。这些文件都没有“导出”自己以使其可用于从单个文件“导入”——它们目前只是在 `index.html` 文件中的脚本标签中被引用。如何使用 webpack 将所有这些第三方文件捆绑到一个文件中？ (3认同)

Answer 2

您可以传递一个条目数组：

module.exports = {
   entry: ['./main.js', './app.js'],
   ...
};

另外，您可以将它们作为CLI 选项传递：

webpack ./main.js ./app.js --config=webpack.config.js