webpack:在html模板中使用哈希文件名

我现在有webpack生成我的bunde文件,名称中有一个哈希:

bundle.649c4c4e6c8076189257.cache.js

我还想出了如何让webpack使用HtmlWebpackPlugin从html模板生成我的主html页面.

这是我的问题,在我的html模板中,我有捆绑文件名硬编码:

<script src="bundle.649c4c4e6c8076189257.cache.js"></script>

我宁愿有一些变量,像这样:

<script src="${bundleFileName}"></script>

我如何使用webpack执行此操作?

最佳答案 如果需要,html-webpack-plugin允许您配置自己的模板:
https://github.com/ampedandwired/html-webpack-plugin#writing-your-own-templates.

但是你的用例看起来非常简单,所以你不应该那样做. html-webpack-plugin已经使用正确的命名模式为您处理脚本标记.因此,您可以省略源索引html文件中的脚本标记,并让插件插入它们.

有关详细信息,请参阅https://github.com/ampedandwired/html-webpack-plugin#configuration中的html-webpack-plugin文档如何配置插件以使用您的html文件.通常它应该足以引用模板来实现您想要的结果.

点赞