组合htmlwebpackplugin块

我需要询问如何组合多个htmlwebpackplugin代码，并编写更优雅的代码

我需要一个解决方案，每次复制这个

新的HtmlWebpackPlugin（{/..somecode}）

代码的一部分时，它都会减轻我的负担

new HtmlWebpackPlugin({
            filename: "index.html",
            template: "build/index.html",
            hash: true,
            chunks: ["index"]
        }),

         new HtmlWebpackPlugin({
             filename:"footer.html",
             template:"build/footer.html",
             chunks:["footer"]
         }),
         new HtmlWebpackPlugin({
             filename:"news.html",
             template:"build/news.html",
             chunks:["news"]
         }),
         new HtmlWebpackPlugin({
               filename: "one-news.html",
               template: "build/one-news.html",
               chunks: ["oneNews"]
         }),
         new HtmlWebpackPlugin({
             filename: "project.html",
             template: "build/project.html",
             chunks: ["project"]
         }),
         new HtmlWebpackPlugin({
             filename: "about-us.html",
             template: "build/about-us.html",
             chunks: ["aboutUs"]
         }),
         new HtmlWebpackPlugin({
             filename: "contact.html",
             template: "build/contact.html",
             chunks: ["contact"]
         }),

---

尝试在循环中创建HtmlWebpackPlugin：

const webpackConfig = {
  mode: 'development',
  ...
};

['index', 'footer', 'one-news'].forEach((file) => {
  webpackConfig.plugins.push(
    new HtmlWebpackPlugin({
      filename: `${flie}.html`,
      template: `build/${file}.html`,
      chunks: [file.replace(/-(\w)/g, (match, c) => c.toUpperCase())]
    })
  );
})

---

您应该首先将所有的webpack配置放入

webpackConfig

变量中。然后在

forEach

循环中添加这些HtmlWebpackPluginYup这项工作非常感谢，先生，我接受您的回答，并接受我的+1；）