Question

我的目标是替换像

这样的字符串

<!--configjs-->

与

<script src="/api/config?bundle-hash"></script>

在我的index.html文件中

我正在使用https://github.com/AngularClass/NG6-starter

plugins: [
    // Injects bundles in your index.html instead of wiring all manually.
    // It also adds hash to all injected assets so we don't have problems
    // with cache purging during deployment.
    new HtmlWebpackPlugin({
      template: 'client/index.html',
      inject: 'body',
      hash: true
    })
]

Answer 1

您想使用html-webpack-plugin

配置插件，（我认为你想将注入转为false以提供更好的控制）。

// webpack.config.js
plugins: [new HtmlWebpackPlugin(
    {
       inject : false,
       template : 'index.html'
    }
)]

在你的html模板中按名称调出块。

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
    <script src="<%= htmlWebpackPlugin.files['bundle-hash'].entry %>"></script>
  </head>
  <body>
  </body>
</html>

我并不完全确定您的确切需求，但您可以只使用插件默认设置并获取您正在寻找的内容。该插件可以将现有的html文件作为模板，并在头部注入CSS，并在正文中注入脚本。如果你想要更多的控制权，你可以做我上面提出的建议。

webpack用index.htm中的bundle hash替换占位符

1 个答案: