Merge branch 'main' into dev

Author: ShenQingchuan

.github/workflows/deploy.yml

@@ -75,8 +75,8 @@ export default defineConfig({
     },
 
     footer: {
-      message: '根据 MIT 许可证发布。',
-      copyright: 'Copyright © 2019-present Evan You & Vite Contributors'
+      copyright:
+        '本中文文档内容版权为 Vite 官方中文翻译团队所有，保留所有权利。'
     },
 
     nav: [
@@ -261,7 +261,7 @@ export default defineConfig({
 
   markdown: {
     anchor: {
-      permalink: renderPermaLink,
+      permalink: renderPermaLink
     },
     config: (md) => {
       md.use(MarkDownItCustomAnchor)

.vitepress/config.ts

@@ -11,15 +11,4 @@ export default function(md) {
     const titleAndId = oldTitle(tokens, idx, options, env, slf);
     return removeAnchorFromTitle(titleAndId);
   };
-
-  const oldHeading = md.renderer.rules.heading_open;
-  md.renderer.rules.heading_open = (tokens, idx, options, env, slf) => {
-    const head = oldHeading(tokens, idx, options, env, slf);
-    const data = md.__data;
-    const headers = data.headers || (data.headers = []);
-    headers.forEach(element => {
-      element.title = removeAnchorFromTitle(element.title);
-    });
-    return head;
-  }
-};
+};

.vitepress/markdown-it-custom-anchor/index.js

@@ -57,6 +57,7 @@
   background: var(--c-brand);
   color: white;
   border-radius: 10px;
+  vertical-align: middle;
 }
 
 #wwads-container {

.vitepress/theme/custom.css

@@ -0,0 +1 @@
+cn.vitejs.dev

CNAME

@@ -53,3 +53,17 @@ $ pnpm i
 # 启动开发服务器
 $ pnpm dev
 ```
+
+## 版权声明
+
+本仓库所包含的中文翻译内容（即所有 `.md` 文件），其版权为 Vite 官方中文翻译团队所有。除官方中文文档 [cn.vitejs.dev](https://cn.vitejs.dev) 之外，不得在其它域名下进行未经授权的转载或部署。
+
+## 贡献者统计
+
+> 统计规则：所有通过 Pull Request 产生了对 `main` 分支 commit 的贡献者。
+> 
+> 头像图生成逻辑参见：[github-contributor-svg-generator](https://github.com/ShenQingchuan/github-contributor-svg-generator)
+
+<p align="center">
+  <img src="https://cdn.jsdelivr.net/gh/ShenQingchuan/github-contributor-svg-generator@main/dist/vitejs/docs-cn.png" />
+</p>

README.md

@@ -1,7 +1,5 @@
 # 配置 Vite {#configuring-vite}
 
-## 配置文件 {#config-file}
-
 当以命令行方式运行 `vite` 时，Vite 会自动解析 [项目根目录](/guide/#index-html-and-project-root) 下名为 `vite.config.js` 的文件。
 
 最基础的配置文件是这样的：
@@ -23,7 +21,7 @@ vite --config my-config.js
 
 ## 配置智能提示 {#config-intellisense}
 
-因为 Vite 本身附带 Typescript 类型，所以你可以通过 IDE 和 jsdoc 的配合来实现智能提示：
+因为 Vite 本身附带 TypeScript 类型，所以你可以通过 IDE 和 jsdoc 的配合来实现智能提示：
 
 ```js
 /** @type {import('vite').UserConfig} */
@@ -80,7 +78,7 @@ export default defineConfig(async ({ command, mode }) => {
 })
 ```
 
-### 环境变量 {#environment-variables}
+## 环境变量 {#environment-variables}
 
 环境变量通常可以从 `process.env` 获得。
 

config/index.md

@@ -305,12 +305,12 @@ Vite 插件也可以提供钩子来服务于特定的 Vite 目标。这些钩子
 
   注意 `configureServer` 在运行生产版本时不会被调用，所以其他钩子需要防范它缺失。
 
-### `configurePreviewServer`
+### `configurePreviewServer` {#configurepreviewserver}
 
 - **类型：** `(server: { middlewares: Connect.Server, httpServer: http.Server }) => (() => void) | void | Promise<(() => void) | void>`
 - **种类：** `async`, `sequential`
 
-  与 [`configureServer`](/guide/api-plugin.html#configureserver) 相同但是作为预览服务器。。它提供了一个 [connect](https://github.com/senchalabs/connect) 服务器实例及其底层的 [http server](https://nodejs.org/api/http.html)。与 `configureServer` 类似，`configurePreviewServer` 这个钩子也是在其他中间件安装前被调用的。如果你想要在其他中间件 **之后** 安装一个插件，你可以从 `configurePreviewServer` 返回一个函数，它将会在内部中间件被安装之后再调用：
+  与 [`configureServer`](/guide/api-plugin.html#configureserver) 相同但是作为预览服务器。它提供了一个 [connect](https://github.com/senchalabs/connect) 服务器实例及其底层的 [http server](https://nodejs.org/api/http.html)。与 `configureServer` 类似，`configurePreviewServer` 这个钩子也是在其他中间件安装前被调用的。如果你想要在其他中间件 **之后** 安装一个插件，你可以从 `configurePreviewServer` 返回一个函数，它将会在内部中间件被安装之后再调用：
 
   ```js
   const myPlugin = () => ({
@@ -516,17 +516,17 @@ normalizePath('foo\\bar') // 'foo/bar'
 normalizePath('foo/bar') // 'foo/bar'
 ```
 
-## Filtering, include/exclude pattern
+## 过滤与 include/exclude 模式 {#filtering-include-exclude-pattern}
 
-Vite exposes [`@rollup/pluginutils`'s `createFilter`](https://github.com/rollup/plugins/tree/master/packages/pluginutils#createfilter) function to encourage Vite specific plugins and integrations to use the standard include/exclude filtering pattern, which is also used in Vite core itself.
+Vite 暴露了 [`@rollup/pluginutils` 的 `createFilter`](https://github.com/rollup/plugins/tree/master/packages/pluginutils#createfilter) 函数，以支持 Vite 独有插件和集成使用标准的 include/exclude 过滤模式，Vite 核心自身也正在使用它。
 
-## Client-server Communication
+## 客户端与服务端间通信 {#client-server-communication}
 
-Since Vite 2.9, we provide some utilities for plugins to help handle the communication with clients.
+从 Vite 2.9 开始，我们为插件提供了一些实用工具，以帮助处理与客户端的通信。
 
-### Server to Client
+### 服务端到客户端 {#server-to-client}
 
-On the plugin side, we could use `server.ws.send` to broadcast events to all the clients:
+在插件一侧，我们可以使用 `server.ws.send` 去给所有客户端广播事件：
 
 ```js
 // vite.config.js
@@ -542,11 +542,11 @@ export default defineConfig({
 })
 ```
 
-::: tip NOTE
-We recommend **always prefixing** your event names to avoid collisions with other plugins.
+::: tip 注意
+我们建议总是给你的事件名称 **添加前缀**，以避免与其他插件冲突。
 :::
 
-On the client side, use [`hot.on`](/guide/api-hmr.html#hot-on-event-cb) to listen to the events:
+在客户端侧，使用 [`hot.on`](/guide/api-hmr.html#hot-on-event-cb) 去监听事件：
 
 ```ts
 // client side
@@ -557,9 +557,9 @@ if (import.meta.hot) {
 }
 ```
 
-### Client to Server
+### 客户端到服务端 {#client-to-server}
 
-To send events from the client to the server, we can use [`hot.send`](/guide/api-hmr.html#hot-send-event-payload):
+为了从客户端向服务端发送事件，我们可以使用 [`hot.send`](/guide/api-hmr.html#hot-send-event-payload)：
 
 ```ts
 // client side
@@ -568,7 +568,7 @@ if (import.meta.hot) {
 }
 ```
 
-Then use `server.ws.on` and listen to the events on the server side:
+然后使用 `server.ws.on` 并在服务端监听这些事件：
 
 ```js
 // vite.config.js

guide/api-plugin.md

@@ -48,7 +48,7 @@ export default defineConfig({
 
 ## 产物分块策略 {#chunking-strategy}
 
-你可以配置在使用 `build.rollupOptions.output.manualChunks` 时各个 chunk 是如何分割的（查看 [Rollup 相应文档](https://rollupjs.org/guide/en/#outputmanualchunks)）。到 Vite 2.8 时，默认的策略是将 chunk 分割为 `index` 和 `vendor`。这对一些 SPA 来说是好的策略，但是要对每一种用例目标都提供一种通用解决方案是非常困难的。从 Vite 2.9 起，`manualChunks` 默认情况下不再被更改。你可以通过在配置文件中添加 `splitVendorChunkPlugin` 来继续使用 “分割 Vendor Chunk” 策略：
+你可以通过配置 `build.rollupOptions.output.manualChunks` 来自定义 chunk 分割策略（查看 [Rollup 相应文档](https://rollupjs.org/guide/en/#outputmanualchunks)）。在 Vite 2.8 及更早版本中，默认的策略是将 chunk 分割为 `index` 和 `vendor`。这对一些 SPA 来说是好的策略，但是要对所有应用场景提供一种通用解决方案是非常困难的。从 Vite 2.9 起，`manualChunks` 默认情况下不再被更改。你可以通过在配置文件中添加 `splitVendorChunkPlugin` 来继续使用 “分割 Vendor Chunk” 策略：
 
 ```js
 // vite.config.js
@@ -60,7 +60,7 @@ export default defineConfig({
 
 也可以用一个工厂函数 `splitVendorChunk({ cache: SplitVendorChunkCache })` 来提供该策略，在需要与自定义逻辑组合的情况下，`cache.reset()` 需要在 `buildStart` 阶段被调用，以便构建的 watch 模式在这种情况下正常工作。
 
-## 文件变化时重新构建 {#rebuild-on-files-changs}
+## 文件变化时重新构建 {#rebuild-on-files-changes}
 
 你可以使用 `vite build --watch` 来启用 rollup 的监听器。或者，你可以直接通过 `build.watch` 调整底层的 [`WatcherOptions`](https://rollupjs.org/guide/en/#watch-options) 选项：
 

guide/build.md

@@ -11,7 +11,7 @@ Pre-bundling dependencies: （正在预构建依赖：）
 
 ## 原因 {#the-why}
 
-这就是 Vite 执行的所谓的“依赖预构建”。这个过程有两个目的:
+这就是 Vite 执行时所做的“依赖预构建”。这个过程有两个目的:
 
 1. **CommonJS 和 UMD 兼容性:** 开发阶段中，Vite 的开发服务器将所有代码视为原生 ES 模块。因此，Vite 必须先将作为 CommonJS 或 UMD 发布的依赖项转换为 ESM。
 
@@ -40,7 +40,7 @@ Pre-bundling dependencies: （正在预构建依赖：）
 
 ## Monorepo 和链接依赖 {#monorepos-and-linked-dependencies}
 
-在一个 monorepo 启动中，该仓库中的某个依赖可能会成为另一个包的依赖。Vite 会自动侦测没有从 `node_modules` 解析的依赖项，并将链接的依赖视为源码。它不会尝试打包被链接的依赖，而是会分析被链接依赖的依赖列表。
+在一个 monorepo 启动中，该仓库中的某个包可能会成为另一个包的依赖。Vite 会自动侦测没有从 `node_modules` 解析的依赖项，并将链接的依赖视为源码。它不会尝试打包被链接的依赖，而是会分析被链接依赖的依赖列表。
 
 然而，这需要被链接的依赖被导出为 ESM 格式。如果不是，那么你可以在配置里将此依赖添加到 [`optimizeDeps.include`](/config/dep-optimization-options.md#optimizedeps-include) 和 [`build.commonjsOptions.include`](/config/build-options.md#build-commonjsoptions) 这两项中。
 
@@ -67,7 +67,7 @@ export default defineConfig({
 
 默认的依赖项发现为启发式可能并不总是可取的。在你想要显式地从列表中包含/排除依赖项的情况下, 请使用 [`optimizeDeps` 配置项](/config/dep-optimization-options.md)。
 
-当你遇到不能直接在源码中发现的 import 时，`optimizeDeps.include` 或 `optimizeDeps.exclude` 就是典型的用例。例如，import 可能是插件转换的结果。这意味着 Vite 无法在初始扫描时发现 import —— 它只能在浏览器请求文件时转换后才能发现。这将导致服务器在启动后立即重新打包。
+`optimizeDeps.include` 或 `optimizeDeps.exclude` 的一个典型使用场景，是当 Vite 在源码中无法直接发现 import 的时候。例如，import 可能是插件转换的结果。这意味着 Vite 无法在初始扫描时发现 import —— 只能在文件被浏览器请求并转换后才能发现。这将导致服务器在启动后立即重新打包。
 
 `include` 和 `exclude` 都可以用来处理这个问题。如果依赖项很大（包含很多内部模块）或者是 CommonJS，那么你应该包含它；如果依赖项很小，并且已经是有效的 ESM，则可以排除它，让浏览器直接加载它。