webpack - html-webpack-plugin 产生冗余标签

Question

我使用html-webpack-plugin来使用 webpack 缩小 html 文件。

原始 html 文件只有<script src="./app.js"></script>.，但在我使用 html-webpack-plugin 缩小文件后，它会生成<script src="./app.js"></script><script src="app.js"></script>. 它插入了一个多余的<script src="app.js"></script>. 我已经尝试了html-minifier提供的所有选项，但还没有解决问题。

有谁知道如何解决这个问题？

我的 webpack 配置的一部分：

new HtmlWebpackPlugin({
    template: 'app/main.html',
    filename: 'index.html',
    minify: {
      collapseWhitespace: true,
      removeComments: true,
      removeRedundantAttributes: true,
      removeScriptTypeAttributes: true,
      removeStyleLinkTypeAttributes: true,
    },
  }),

Answer 1

插件中有一个选项。您可以将其设置为 false 并自己编写，也可以将其设置为 true 等并从 html 中删除行。

inject: false // "body", "head"

更多：

inject  {Boolean|String}    true    true || 'head' || 'body' || false Inject all assets into the given template or templateContent. When passing true or 'body' all javascript resources will be placed at the bottom of the body element. 'head' will place the scripts in the head element