原理

webpack的热更新原理其实比较简单，它分为服务端和浏览器端，在服务端和浏览器端通过webscoker进行连接起来。

服务器端

服务器端做的主要事情就是启动一个服务，然后监控代码是否有变动，如果发现代码有变动之后，重新编译代码，当代码编译完成之后，通过websocket发送两个事件，一个是hash事件，通过浏览器端我这里有代码改动了，你准备到我这里来拿那些模块改变了吧,同时把新编译的代码产生的hash也传给你，以便你需要的时候拿过来使用。一个是ok事件，通知你我新编译完成了代码，浏览器端你可以准备更新页面吧。

当然hash事件和ok事件可以放在一个事件里边一起处理，不过分开比较好理解些。

浏览器端

当浏览器端收到hash事件之后，就知道代码有变动了，我得需要重新去下载代码了，所以会使用上次服务器传过来的hash，发送一个hash.hot-update.json的请求。当请求结束之后，服务器端返回的结果里边就包含了哪些模块有了修改，浏览器端再根据这些结果，发送 xx.hash.hot-update.js.

当获取到最新的js代码后，浏览器就可以通过执行这些代码，重新进行渲染，达到热更新的效果。