核心架构

相关源文件

• docs/guide/cli.md
• packages/vite/src/node/__tests__/__snapshots__/utils.spec.ts.snap
• packages/vite/src/node/__tests__/scan.spec.ts
• packages/vite/src/node/__tests__/utils.spec.ts
• packages/vite/src/node/build.ts
• packages/vite/src/node/cli.ts
• packages/vite/src/node/config.ts
• packages/vite/src/node/http.ts
• packages/vite/src/node/index.ts
• packages/vite/src/node/logger.ts
• packages/vite/src/node/optimizer/esbuildDepPlugin.ts
• packages/vite/src/node/optimizer/index.ts
• packages/vite/src/node/optimizer/optimizer.ts
• packages/vite/src/node/optimizer/scan.ts
• packages/vite/src/node/plugin.ts
• packages/vite/src/node/plugins/asset.ts
• packages/vite/src/node/plugins/css.ts
• packages/vite/src/node/plugins/html.ts
• packages/vite/src/node/plugins/importAnalysis.ts
• packages/vite/src/node/plugins/importAnalysisBuild.ts
• packages/vite/src/node/plugins/index.ts
• packages/vite/src/node/plugins/optimizedDeps.ts
• packages/vite/src/node/plugins/preAlias.ts
• packages/vite/src/node/plugins/resolve.ts
• packages/vite/src/node/preview.ts
• packages/vite/src/node/server/hmr.ts
• packages/vite/src/node/server/index.ts
• packages/vite/src/node/server/middlewares/__tests__/hostCheck.spec.ts
• packages/vite/src/node/server/middlewares/hostCheck.ts
• packages/vite/src/node/server/middlewares/indexHtml.ts
• packages/vite/src/node/server/middlewares/transform.ts
• packages/vite/src/node/server/moduleGraph.ts
• packages/vite/src/node/server/pluginContainer.ts
• packages/vite/src/node/server/transformRequest.ts
• packages/vite/src/node/server/ws.ts
• packages/vite/src/node/utils.ts

本文档涵盖了 Vite 的核心架构，包括配置系统、服务器创建过程、插件容器系统和环境管理。它侧重于实现 Vite 开发和构建功能的基础构建模块。

有关插件系统钩子和扩展机制的信息，请参阅插件系统。有关热模块替换（HMR）和中间件等开发服务器特定功能，请参阅开发服务器。

架构概述

Vite 的核心架构围绕三个主要系统：配置解析、环境管理和插件编排。该架构通过统一的插件系统支持开发（serve 命令）和生产（build 命令）模式。

高层架构

来源：packages/vite/src/node/config.ts544-635 packages/vite/src/node/server/index.ts254-418 packages/vite/src/node/build.ts84-284

配置解析系统

配置系统将用户配置转换为所有其他系统使用的已解析配置。`resolveConfig` 函数是此过程的中央协调器。

配置解析流程

`resolveConfig` 函数执行几项关键任务：

1. 配置加载：使用 `loadConfigFromFile` 从文件加载配置
2. 环境解析：通过 `resolveEnvironmentOptions` 解析特定于环境的选项
3. 插件解析：通过 `resolvePlugins` 处理和验证插件
4. 选项合并：使用 `mergeWithDefaults` 将默认值与用户配置合并

来源：packages/vite/src/node/config.ts1039-1257 packages/vite/src/node/config.ts771-842 packages/vite/src/node/config.ts159-161

服务器创建过程

`createServer` 函数通过初始化环境、插件容器和中间件系统来协调 Vite 开发服务器的创建。

服务器初始化流程

服务器创建的关键方面：

1. 环境初始化：每个环境（客户端、SSR）都有自己的 `DevEnvironment` 实例
2. 插件容器创建：`createPluginContainer` 函数创建统一容器和每个环境的容器
3. 中间件设置：配置 Connect 中间件堆栈以处理请求
4. WebSocket 设置：建立 HMR 通信通道

来源：packages/vite/src/node/server/index.ts425-429 packages/vite/src/node/server/index.ts431-540 packages/vite/src/node/server/index.ts514-529

插件容器系统

插件容器系统提供了一个兼容 Rollup 的插件执行环境。它支持统一插件容器（出于向后兼容性）和每个环境的插件容器。

插件容器架构

插件容器实现了 Rollup 插件 API，并包含 Vite 特有的扩展。

1. 钩子处理：按正确的顺序和适当的上下文执行插件钩子
2. Source Map 处理：合并来自多个转换步骤的 Source Map
3. 错误处理：提供带有代码帧的详细错误报告
4. 模块图集成：在处理过程中更新模块关系

来源：packages/vite/src/node/server/pluginContainer.ts578-629 packages/vite/src/node/server/pluginContainer.ts1217-1305 packages/vite/src/node/server/pluginContainer.ts630-699

环境系统

Vite 的环境系统允许不同的执行上下文（客户端、SSR、构建）拥有独立的插件实例、模块图和配置，同时共享通用基础设施。

环境层级

环境特性

1. 隔离性：每个环境维护自己的模块图和插件状态
2. 配置：每个环境的配置允许不同的解析选项、插件等
3. 模块运行：可运行的环境可以直接执行模块
4. 热更新：开发环境支持 HMR 更新

来源：packages/vite/src/node/baseEnvironment.ts1-45 packages/vite/src/node/server/environment.ts1-50 packages/vite/src/node/config.ts251-299

模块图和请求处理

模块图在每个环境中跟踪模块关系和转换。请求处理通过插件容器流，以转换和解析模块。

请求处理流程

关键处理步骤：

1. 请求解析：通过 `resolveId` 钩子将 URL 解析为文件路径
2. 模块加载：通过 `load` 钩子加载文件内容
3. 转换：通过 `transform` 钩子转换内容
4. 缓存：结果缓存在模块图中
5. 依赖跟踪：跟踪导入关系以进行 HMR

来源：packages/vite/src/node/server/transformRequest.ts78-156 packages/vite/src/node/server/middlewares/transform.ts74-252 packages/vite/src/node/server/moduleGraph.ts1-200