Webpack - 更新HTML以包含最新[哈希]捆绑包的最佳方式

时间:2017-01-30 17:37:45

标签: javascript html webpack browser-cache webpack-2

我正在使用webpack生成散列包文件名。

假设我使用静态HTML,CSS& JS,自动更新index.html以指向最新捆绑包的最佳方法是什么?

例如,

更新

<script src="e8e839c3a189c25de178.app.js"></script>
<script src="c353591725524074032b.vendor.js"></script>

<script src="d6cba2f2e2fb3f9d98aa.app.js"></script>
<script src="c353591725524074032b.vendor.js"></script> // no change
每当新的捆绑版本可用时,

自动。

1 个答案:

答案 0 :(得分:2)

令人惊讶的是,这就是html-webpack-plugin的用途。

conda install -c menpo opencv=3.0.0

这会在var webpack = require('webpack'); var path = require('path'); var HTMLWebpackPlugin = require('html-webpack-plugin'); module.exports = function(env) { return { entry: { main: './src/index.js', vendor: 'moment' }, output: { filename: '[chunkhash].[name].js', path: path.resolve(__dirname, 'dist') }, plugins: [ new webpack.optimize.CommonsChunkPlugin({ names: ['vendor', 'manifest'] }), new HTMLWebpackPlugin({ tempate: path.join(__dirname, './src/index.html') }) ] } }; 目录中生成index.html,其中包含dist的正确顺序。

youtube example