·更新于 2026年4月21日· 52 次浏览 Vue3Vite
Vite + Vue 3：依赖预构建、HMR 与生产构建路径
为何预打包 `node_modules`；原生 ESM 开发与 Rollup 生产的关系；常见别名与 SSR 外部化注意点。
作者
ZHOU YI
开发态 Vite 利用浏览器 ESM 按需编译，冷启动快；对 CJS/非标准入口包做 optimizeDeps 预构建，减少请求瀑布与重复解析。
HMR
Vue SFC 热更新在模块边界替换组件实例并保留状态（受限于改动类型）。理解边界有助于排查「热更后状态错乱」。
- 生产构建走 Rollup，tree-shaking 与 chunk 分割策略与开发不同
- SSR 需区分
import.meta.env.SSR与外部化 Node 内置模块 resolve.alias要与 TSpaths同步，避免类型与运行时不一致
“开发体验与产物体积往往在工具链配置上取得平衡。”