Webpack 如何包含具有多个入口点的适当网页包包？

在多条目网页设置中，自动生成（甚至手动计算）用于入口点的脚本标记的最佳方法是什么

我正在设置一个MVC应用程序，使用webpack处理大量javascript依赖库。由于MVC应用程序为每条路线加载一个新页面，我有几十个入口点，每个入口点都有自己的入口脚本

我使用代码拆分和哈希命名（用于缓存破坏）

由于webpack正在为每个入口点计算依赖关系树，因此它似乎在将代码分解成包以供重用方面做得很好。这是我的配置（减去顶部的代码和插件）：

对于这个例子，我将条目限制为2个，但还有更多的条目

此设置的

dist

中的输出为：

 index.html                               
 npm.accounting.acb8cd33.js               
 npm.dropzone.1dcac339.js                 
 npm.jquery.7fe2b020.js                   
 npm.knockout-amd-helpers.356a8521.js     
 npm.knockout-punches.efb33702.js         
 npm.knockout.eaf67101.js                 
 npm.knockout.mapping.e01549c3.js         
 npm.moment.0f7e6808.js                   
 npm.sprintf-js.82f89700.js               
 npm.toastr.c6448676.js                   
 npm.webpack.2aab6b7b.js                  
 runtime.acfdeda3.js                      
 products_index.8ef7831b.js             
 products_index~users_index.02e60e46.js 
 users_index.42c4b7af.js                  

这种方法是令人信服的，而且似乎是合乎逻辑的，所以我使用了它

在我为这个怪物创建脚本标签之前，一切似乎都进行得很顺利

例如，在

/users

路径上，如何知道要包含哪些文件？似乎webpack已经完成了所有这些依赖关系映射，让我自己再做一遍

我在Webpack文档站点中找不到任何提到如何最好地做到这一点的内容，除了一个讨论，它似乎只专注于创建一个无用的HTML文件，将所有脚本标记塞进一个文件中

---

我肯定错过了一些显而易见的东西。

我终于找到了一个答案，这个答案隐藏在对html网页插件github网站上一个问题的回应中

如果您指定插件的入口点块，它将正确地从那里计算依赖项，因此您可以在网页配置中创建一个循环，用于构建

条目

配置和

插件

配置部分，然后将它们添加到配置中，如下所示：

var entry: {
        a: "./a",
        b: "./b",
        c: ["./c", "./d"]
};

var entryHtmlPlugins = Object.keys(entry).map(function(entryName) {
   return new HtmlWebpackPlugin({
      filename: entryName + '.html',
      chunks: [entryName]
  })
});

module.export = {
   entry: entry,
   //....
  plugins: [
      // ..
  ].concat(entryHtmlPlugins)
}

问题页面如下：

至少在我的初步测试中，这似乎是可行的。如果在文档中的某个地方提到，那就太好了

var entry: {
        a: "./a",
        b: "./b",
        c: ["./c", "./d"]
};

var entryHtmlPlugins = Object.keys(entry).map(function(entryName) {
   return new HtmlWebpackPlugin({
      filename: entryName + '.html',
      chunks: [entryName]
  })
});

module.export = {
   entry: entry,
   //....
  plugins: [
      // ..
  ].concat(entryHtmlPlugins)
}