Vite 原理深入剖析

1. 整体架构设计

Vite 的整体架构由几个关键模块组成，每个模块都对应具体的源码文件：

• 开发服务器：用于处理浏览器请求、模块解析和热更新。开发服务器的代码主要位于 src/node/server/index.ts。

• 模块解析与热更新：通过模块中间件拦截请求，处理代码转换与热模块替换。相关代码在 src/node/server/middlewares/moduleRewrite.ts 和 src/node/server/hmr.ts 中。

• 构建工具链：在生产环境下使用 Rollup 进行打包构建。构建相关的逻辑主要在 src/node/build.ts 中。

• 插件系统：Vite 拥有插件机制，允许扩展功能，插件系统的核心逻辑位于 src/node/plugins/index.ts。

2. 核心源码细节与对应文件

2.1. 开发服务器

Vite 的开发服务器是基于 Node 的原生 http 模块构建的。相关代码位于 src/node/server/index.ts 。

• 启动 HTTP 服务器：createServer 函数是启动开发服务器的入口，它调用 Node 的 http.createServer 来创建 HTTP 服务器，并注册中间件以处理各种请求。

• 处理请求：sr