Vite内核解析

第1章 为什么需要理解 Vite :::tip 本章要点 理解前端构建工具从 Webpack 到 Vite 的演进动力 掌握 Vite 的两大核心创新：原生 ESM 开发服务器与 Rolldown 构

第3章 配置系统 :::tip 本章要点 深入剖析 config.ts（2704 行），理解 Vite 配置系统的完整架构 掌握 UserConfig 到 ResolvedConfig 的转换过程及其

第4章 插件系统与 Hook 机制 开篇引言 如果说配置系统定义了 Vite "做什么"，那么插件系统就定义了 Vite "怎么做"。Vite 的核心能力——模块解析、代码转换、CSS 处理、HTML

第7章 HMR 热更新 :::tip 本章要点 HMR 的完整链路由四个阶段构成：文件系统变更检测、服务端模块图失效与更新传播、WebSocket 消息推送、客户端模块替换执行 propagateUp

第9章 JavaScript 与 TypeScript 转换 开篇引言 当浏览器请求一个 .ts 或 .tsx 文件时，开发服务器不能直接返回源文件——浏览器不理解 TypeScript 类型注解，也

第17章 Web Worker 与特殊资源 开篇引言 现代 Web 应用不仅包含 JavaScript 和 CSS，还需要处理各种特殊类型的资源：Web Worker 提供了多线程计算能力，WebAs

第6章 模块图与依赖追踪 :::tip 本章要点 EnvironmentModuleNode 是模块图的基本单元：每个节点承载 url、id、file、type、transformResult 等关键

第15章 SSR 与模块运行器 开篇引言 服务端渲染（Server-Side Rendering, SSR）是现代 Web 框架的核心能力。它要求同一套源代码既能在浏览器中运行，又能在 Node.js

第12章 静态资源处理 Web 应用不仅仅由 JavaScript 和 CSS 构成。图片、字体、音视频、JSON 文件、纯文本等静态资源构成了应用的血肉。在原始的开发流程中，开发者需要手动管理这些资

第18章 设计模式与架构决策 开篇引言 在前面十七章中，我们从源码层面深入分析了 Vite 的每一个核心子系统。现在是时候退后一步，从更高的抽象层次审视 Vite 的设计智慧了。 Vite 不仅是一个

第2章 架构总览 :::tip 本章要点 从一个 HTTP 请求的完整旅程理解 Vite 开发服务器的工作机制 掌握 Vite 四大核心子系统：开发服务器、插件系统、模块图、构建引擎 深入了解 src

第16章 Environment API 开篇引言 在 Vite 6 之前，一个 Vite 服务器实例只有一个统一的模块图、插件管线和依赖优化器。当项目需要同时处理客户端代码和 SSR 代码时，这些共

第11章 HTML 转换与入口解析 在传统的前端构建工具中，JavaScript 文件是天然的入口点。Webpack 以 entry 配置指向一个或多个 JS 文件，由此启动整个依赖图的构建。Vite

第13章 Rolldown 构建引擎 如果说开发服务器是 Vite 的左手——灵活、快速、按需响应——那么构建引擎就是它的右手——全面、深入、系统优化。开发时按需编译的策略带来了极致的启动速度和即时反

第5章 开发服务器架构 开篇引言 Vite 的开发服务器是整个项目中最复杂的子系统。它不只是一个"启动一个 HTTP 服务器然后返回文件"的简单程序——它是一个精密的运行时环境，需要在接收到浏览器请求

前言 写作动机 2024 年，当 Evan You 在 ViteConf 上宣布 Rolldown——一个用 Rust 重写的 Rollup 兼容打包器将成为 Vite 的默认构建引擎时，前端社区意识

第8章 依赖预构建 开篇引言 在浏览器原生支持 ES Module 的今天，一个合理的疑问是：既然浏览器能直接通过 import 语句加载模块，为什么 Vite 还需要一个"预构建"步骤？ 答案隐藏在