我使用Webpack pug-html-loader + file-loader来生成一堆静态pug模板。
我也想开始添加散列包文件名,但我不能解决如何插入散列文件名到我所有的pug模板
这是我目前在所有pug模板中引用我的bundle的方式:
script(src="bundle.js")
link(href="bundle.css")
我应该如何修改它来引用bundle-[chunkhash].js
/bundle-[chunkhash].css]
-我需要传递一些变量到webpack.config.js中的pug-html-loader吗?
注意:我使用extract-text-plugin将SASS输出到一个.css包文件
1条答案
按热度按时间3duebb1j1#
要将散列包文件名插入到静态pug模板中,需要将变量传递到webpack.config.js文件中的pug-html-loader。
首先,您需要设置您的Webpack配置,以便为您的软件包创建散列文件名。这可以通过使用Webpack插件NamedModulesPlugin并设置输出文件名以包含[chunkhash]占位符来完成。例如:
一旦您的webpack配置被设置为创建bundle的散列文件名,您就可以使用pug-html-loader的选项将这些文件名传递给您的pug模板。在您的webpack.config.js文件中,您可以定义一个'data'对象,其中包含要传递给pug模板的文件名。例如:
然后,在pug模板中,您可以使用'- var'语法引用这些变量。例如:
这将允许您将散列包文件名插入到静态pug模板中。