webpack热更新

webpack-dev-server

借助webpack-dev-server，会监听代码修改，自动构建，构建完成后通过热更新方式让浏览器内容自动发生变化。
webpac-dev-server结合HotModuleReplacementPlugin插件可以开启热更新的功能。

webpack-dev-server不刷新浏览器，也不输出文件（没有磁盘IO），而是放在内存中的。

webpack-dev-middleware

wdm可以实现和webpack-dev-server相同的效果，但是他更适用于灵活的定制场景。

热更新的原理分析

Webpack Compile：将JS编译成Bundle
HMR Server:将热更新的文件输出给HMR Runtime

1.首先是webpack-dev-server中的webpack compile:将JS编译成Bundle
2.HMR Server:将热更新的文件输出给HMR Runtime
3.Bundle server:提供文件在浏览器的访问（localhost:8080)
4.HMR Runtime:会被注入到浏览器，更新文件的变化