Vite 的 HMR 是如何实现的？

Vite 的 HMR 基于原生 ESM 模块图：文件变更后，Vite 在模块图中定位变更模块及其「HMR 边界」——调用 import.meta.hot.accept 的模块，或框架插件自动标记的边界（Vue SFC、React Fast Refresh），通过 WebSocket 通知客户端，客户端用带时间戳的动态 import() 重新请求该模块并执行替换回调，无需刷新整页。

若变更模块没被任何边界接受，更新沿导入链向上冒泡，找不到边界就整页刷新。框架插件负责细粒度更新：Vue SFC 把 template、script、style 拆成可独立更新的块；React 靠 react-refresh 保留组件 state。易错点：组件文件里混合导出非组件内容会破坏 Fast Refresh 边界；import.meta.hot 是 Vite 特有 API，生产构建不存在，要用可选链保护。追问：与 Webpack module.hot 机制的差异、状态保留的实现原理。

if (import.meta.hot) {
  import.meta.hot.accept((mod) => mod && applyUpdate(mod))
}