webpack2配置浏览器自动刷新

前言

老项目用的webpack2,有浏览器刷新开发起来方便多了

解决

单页面的

entry: [
   // 给webpack-dev-server启动一个本地服务，并连接到8080端口
   'webpack-dev-server/client?http://localhost:8080',

   // 给上面启动的本地服务开启自动刷新功能，'only-dev-server'的'only-'意思是只有当模块允许被热更新之后才有热加载，否则就是整页刷新
   'webpack/hot/only-dev-server',

   // webpack的入口文件，注意这个声明必须写在上面两个后面，webpack-dev-server才有效
   './webpack.entry.js'
 ],
 plugins: [
     new webpack.HotModuleReplacementPlugin(),
 ]

多页面

entry: {
    index: ['webpack/hot/dev-server', 'webpack-dev-server/client?http://localhost:8088', './src/components/index/app.js'],
    setting: './src/components/setting/app.js',
    order: './src/components/order/app.js'
},
plugins: [
    new webpack.HotModuleReplacementPlugin()
]

参考文章

• https://github.com/kingvid-chan/webpack2-lessons/tree/master/lesson2
• https://github.com/jawil/webpack2/blob/master/webpack%E7%AE%80%E4%BB%8B%E4%B8%8E%E4%BD%BF%E7%94%A8.md