Vite 的按需编译是开发环境默认机制，无需手动开启；启动时预构建依赖并缓存，后续毫秒级冷启动；源码不打包，浏览器按需请求并实时转译，仅编译被访问的模块。
Vite 的按需编译不是靠手动“开启”的功能，而是它在开发环境下的默认工作方式。你不需要额外写代码去触发它，只要用 Vite 启动开发服务器，这个机制就自动生效。关键在于理解它的运行逻辑，并避免无意中破坏这种高效模式。
依赖预构建只做一次，后续秒级加载
Vite 启动时会自动对 node_modules 中的第三方依赖 做一次预构建（用 esbuild），转成浏览器可直接 import 的 ESM 格式，并缓存到 node_modules/.vite。之后每次启动，这部分不再重复处理。
- 首次启动稍慢（仅第一次），但后续冷启动基本是毫秒级
- 不用像 Webpack 那样每次分析整个依赖图，Vite 只管“谁要了谁，我就编谁”
- 如果你发现启动变慢，先检查是否误改了
vite.config.js导致预构建被跳过或反复执行
源码不打包，浏览器按需请求和编译
你的 .js、.ts、.jsx 等源文件，在开发阶段完全不打包。浏览器访问页面时，根据 HTML 中的 <script type="module" src="/src/main.js"></script> 发起原生 ESM 请求，Vite 服务端实时响应：
- 读取对应源文件，必要时通过插件转译（如 JSX → JS）
- 重写 import 路径，指向已预构建的依赖或其它源模块
- 返回带 source map 的代码，浏览器直接执行
这意味着：改一个组件，只编译它自己和直系依赖；路由懒加载的模块，没访问前根本不会被读取或编译。
立即学习“Java免费学习笔记（深入）”；
别让配置拖慢按需流程
某些配置看似无害，实则可能干扰 Vite 的轻量机制：
- 避免在
vite.config.js中启用不必要的插件（比如全量 Babel 转译），它们会让每个请求都走额外处理链 - 不要把大量逻辑塞进
configureServer钩子，它会在每次请求前运行 - 静态资源（图片、字体）尽量用相对路径或
public/目录，减少 Vite 的模块解析负担
利用 HTTP 缓存进一步提速
Vite 默认为不同资源设置智能缓存策略：
- 源码模块：协商缓存（
304 Not Modified），改了才传新内容 - 预构建依赖：强缓存（
Cache-Control: max-age=31536000, immutable），一年内不重复请求 - 确保开发时浏览器没禁用缓存，否则每次都会重新拉取所有模块
