htmlWebpackPlugin仅向生成的html添加一个入口点

Question

以下是webpack配置条目：

entry:{
    background: './app/main/background.js',
    options: './app/main/options.js'
}

提供给htmlwebpackplugin的一个HTML页面如下

new HtmlWebpackPlugin({
    template :'./app/templates/options.html',
    // chunks : ['jquery','angular','app'],
    filename: "./options.html",
    cache : true
}),

这导致注入两个background.js，options.js在options.html页面如下图所示：

 <script type="text/javascript" src="js/background.js"></script><script type="text/javascript" src="js/options.js"></script></body>

有没有一种方法可以将其限制为仅一个JS文件或指定要在html页面中注入的文件名？

Answer 1

该chunks选项可能是您想要使用的（请参阅文档的过滤块部分）。我不知道为什么它在你的代码片段中被评论，但你可以这样写：

entry: {
    background: './app/main/background.js',
    options: './app/main/options.js'
}

如果您只想options在生成的 HTML 中注入入口点，请指定块：

new HtmlWebpackPlugin({
    template :'./app/templates/options.html',
    chunks : ['options'],
    filename: "./options.html",
    cache : true
}),

Answer 2

似乎您可以使用html-webpack-exclude-assets-plugin

plugins: [
  new HtmlWebpackPlugin({
    excludeAssets: [/style.*.js/] // exclude style.js or style.[chunkhash].js 
  }),
  new HtmlWebpackExcludeAssetsPlugin()
]