Vite 毫秒级冷启动源于按需编译：仅解析 index.html 并改写 import 路径，后续模块由浏览器请求时实时编译；依赖预构建缓存、源码懒编译、原生 ESM 支持共同实现极速启动。
Vite 能做到毫秒级冷启动，关键就是不打包、不预编译整个项目，而是等浏览器真正请求某个模块时，才实时把它转成浏览器能运行的格式——这就是按需编译。
浏览器一发请求，Vite 才开始干活
传统工具（比如 Webpack）启动前得扫描全部文件、建立依赖图、打包成 bundle，项目越大越慢。Vite 完全跳过这步：它只解析 index.html，把里面的 import 语句改写成代理路径（如 /@modules/vue），然后直接把 HTML 返回给浏览器。后续所有模块加载，都由浏览器主动发起 HTTP 请求，Vite 在收到请求那一刻才处理对应文件。
- 访问
/src/main.ts→ Vite 实时转成 ESM，带 Source Map，返回给浏览器 - 加载
Button.vue→ 拆解为 script/style/template 三部分，分别编译再组合返回 - 遇到
import('./utils/feature.js')动态导入 → 只在用户触发该逻辑时才编译那个文件
第三方依赖靠预构建缓存，不是每次重来
node_modules 里的包不会每次启动都重新处理。Vite 启动初期会做一次依赖预构建（optimizeDeps），把 CommonJS 或 UMD 格式的库（如 lodash、monaco-editor）转成标准 ESM，并合并重复引用，结果缓存在 node_modules/.vite。之后启动直接复用缓存，省去大量转换时间。
- 首次启动可能稍慢（要建缓存），但第二次起几乎无感
- 缓存自动失效机制：package.json 中依赖版本变动、node_modules 重装，Vite 会检测并重建
- 手动清理缓存只需删掉
.vite目录，适合排查模块解析异常
源码本身也“懒”，不碰就不转
TS、JSX、Sass、Less、Vue SFC 这些都不是启动时统一转，而是按浏览器实际请求的路径触发对应插件处理：
立即学习“Java免费学习笔记（深入）”；
- 请求
/src/App.vue→ 触发@vitejs/plugin-vue编译 - 请求
/src/index.scss→ 触发内置 Sass 插件，仅编译这一份 - 请求
/src/utils/math.ts→ 用 esbuild 快速转成 JS，不涉及其他 TS 文件
配合原生 ESM，省掉所有运行时兼容层
因为现代浏览器原生支持 import/export，Vite 不需要模拟 CommonJS、注入 require、补 polyfill。它返回的就是干净的 ESM 代码，浏览器直接执行，没有中间解释或包装开销。
- 没有 __webpack_require__、__vite__require 等运行时辅助函数
- 模块路径重写轻量（如
./utils→/src/utils.js），不生成额外映射表 - HMR 更新也基于 ESM 的 import.meta.hot，精准替换，不刷新整页
