用于webpack打包到生产环境后,客户端无刷新的情况下通知用户版本变更信息。依赖createEvent,用addEventListener接收事件。
npm install hashwatcher-webpack-plugin --save-dev
key | type | default | description |
---|---|---|---|
duration | Number | 60000 | interval duration for getting jsonRender.js |
path | String | '' | 'webpackHashWatcher.js' output path |
hashPath | hashPath | '' | 'jsonRender.js' output path |
webpack.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin')
const HashwatcherWebpackPlugin = require('hashwatcher-webpack-plugin')
module.exports = {
entry: {
app: './src/index.js'
},
plugins: [
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true
}),
new HashwatcherWebpackPlugin({
duration: 10000
})
]
}
index.js
// wehn then hash change, it will receive a 'webpackHashChange' event
document.addEventListener('webpackHashChange', (e) => {
console.log(e.diffArr)
alert('检测到系统已更新,请刷新页面更新系统')
})