热更新机制的实现_Hot Reload 究竟是怎么实现的？

关注「前端向后」微信公众号，你将收获一系列「用心原创」的高质量技术文章，主题包括但不限于前端、Node.js以及服务端技术

一.HMR

HMR(Hot Module Replacement)能够对运行时的 JavaScript 模块进行热更新(无需重刷，即可替换、新增、删除模块)

(摘自webpack HMR)

HMR 特性由 webpack 等构建工具提供，并暴露出一系列运行时 API 供应用层框架(如 React、Vue 等)对接：

Basically it’s just a way for modules to say “When a new version of some module I import is available, run a callback in my app so I can do something with it”.

其基本原理是在运行时对(构建工具启动的)Dev Server 发起轮询，通过script标签将有更新的模块注入到运行环境，并执行相关的回调函数：

HMR is just a fancy way to poll the development server, inject