Skip to content

Commit

Permalink
docs: update with main stream
Browse files Browse the repository at this point in the history
release v4.1.2
  • Loading branch information
ShenQingchuan authored Feb 19, 2023
2 parents d324301 + cbf845a commit 8920fbc
Show file tree
Hide file tree
Showing 8 changed files with 77 additions and 50 deletions.
1 change: 1 addition & 0 deletions .vitepress/config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@ export default defineConfig({
},

socialLinks: [
{ icon: 'mastodon', link: 'https://elk.zone/m.webtoo.ls/@vite' },
{ icon: 'twitter', link: 'https://twitter.com/vite_js' },
{ icon: 'discord', link: 'https://chat.vitejs.dev' },
{ icon: 'github', link: 'https://github.com/vitejs/vite' },
Expand Down
8 changes: 4 additions & 4 deletions blog/announcing-vite3.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ Today, 16 months from the v2 launch we are happy to announce the release of Vite
Quick links:

- [Docs](/)
- [Migration Guide](/guide/migration)
- [Migration Guide](https://v3.vitejs.dev/guide/migration.html)
- [Changelog](https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#300-2022-07-13)

If you are new to Vite, we recommend reading the [Why Vite Guide](https://vitejs.dev/guide/why.html). Then check out [the Getting Started](https://vitejs.dev/guide/) and [Features guide](https://vitejs.dev/guide/features) to see what Vite provides out of the box. As usual, contributions are welcome at [GitHub](https://github.com/vitejs/vite). More than [600 collaborators](https://github.com/vitejs/vite/graphs/contributors) have helped improve Vite so far. Follow the updates on [Twitter](https://twitter.com/vite_js), or join discussions with other Vite users on our [Discord chat server](http://chat.vitejs.dev/).
Expand Down Expand Up @@ -193,7 +193,7 @@ There are other deploy scenarios where this isn't enough. For example, if the ge

### Esbuild Deps Optimization at Build Time (Experimental)

One of the main differences between dev and build time is how Vite handles dependencies. During build time, [`@rollup/plugin-commonjs`](https://github.com/rollup/plugins/tree/master/packages/commonjs) is used to allow importing CJS only dependencies (like React). When using the dev server, esbuild is used instead to pre-bundle and optimize dependencies, and an inline interop scheme is applied while transforming user code importing CJS deps. During the development of Vite 3, we introduced the changes needed to also allow the use of [esbuild to optimize dependencies during build time](/guide/migration.html#using-esbuild-deps-optimization-at-build-time). [`@rollup/plugin-commonjs`](https://github.com/rollup/plugins/tree/master/packages/commonjs) can then be avoided, making dev and build time work in the same way.
One of the main differences between dev and build time is how Vite handles dependencies. During build time, [`@rollup/plugin-commonjs`](https://github.com/rollup/plugins/tree/master/packages/commonjs) is used to allow importing CJS only dependencies (like React). When using the dev server, esbuild is used instead to pre-bundle and optimize dependencies, and an inline interop scheme is applied while transforming user code importing CJS deps. During the development of Vite 3, we introduced the changes needed to also allow the use of [esbuild to optimize dependencies during build time](https://v3.vitejs.dev/guide/migration.html#using-esbuild-deps-optimization-at-build-time). [`@rollup/plugin-commonjs`](https://github.com/rollup/plugins/tree/master/packages/commonjs) can then be avoided, making dev and build time work in the same way.

Given that Rollup v3 will be out in the next months, and we're going to follow up with another Vite major, we've decided to make this mode optional to reduce v3 scope and give Vite and the ecosystem more time to work out possible issues with the new CJS interop approach during build time. Frameworks may switch to using esbuild deps optimization during build time by default at their own pace before Vite 4.

Expand All @@ -211,7 +211,7 @@ Vite cares about its publish and install footprint; a fast installation of a new
| Vite 3.0.0 | 3.05MB | 17.8MB |
| Reduction | -30% | -7% |

In part, this reduction was possible by making some dependencies that most users weren't needing optional. First, [Terser](https://github.com/terser/terser) is no longer installed by default. This dependency was no longer needed since we already made esbuild the default minifier for both JS and CSS in Vite 2. If you use `build.minify: 'terser'`, you'll need to install it (`npm add -D terser`). We also moved [node-forge](https://github.com/digitalbazaar/forge) out of the monorepo, implementing support for automatic https certificate generation as a new plugin: [`@vitejs/plugin-basic-ssl`](/guide/migration.html#automatic-https-certificate-generation). Since this feature only creates untrusted certificates that are not added to the local store, it didn't justify the added size.
In part, this reduction was possible by making some dependencies that most users weren't needing optional. First, [Terser](https://github.com/terser/terser) is no longer installed by default. This dependency was no longer needed since we already made esbuild the default minifier for both JS and CSS in Vite 2. If you use `build.minify: 'terser'`, you'll need to install it (`npm add -D terser`). We also moved [node-forge](https://github.com/digitalbazaar/forge) out of the monorepo, implementing support for automatic https certificate generation as a new plugin: [`@vitejs/plugin-basic-ssl`](https://v3.vitejs.dev/guide/migration.html#automatic-https-certificate-generation). Since this feature only creates untrusted certificates that are not added to the local store, it didn't justify the added size.

## Bug Fixing

Expand All @@ -228,7 +228,7 @@ A triaging marathon was spearheaded by [@bluwyoo](https://twitter.com/bluwyoo),
- The Modern Browser Baseline now targets browsers which support the [native ES Modules](https://caniuse.com/es6-module), [native ESM dynamic import](https://caniuse.com/es6-module-dynamic-import), and [`import.meta`](https://caniuse.com/mdn-javascript_operators_import_meta) features.
- JS file extensions in SSR and library mode now use a valid extension (`js`, `mjs`, or `cjs`) for output JS entries and chunks based on their format and the package type.

Learn more in the [Migration Guide](/guide/migration).
Learn more in the [Migration Guide](https://v3.vitejs.dev/guide/migration.html).

## Upgrades to Vite Core

Expand Down
2 changes: 1 addition & 1 deletion config/server-options.md
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ export default defineConfig({

请注意,如果使用了非相对的 [基础路径 `base`](/config/shared-options.md#base),则必须在每个 key 值前加上该 `base`

使用 [`http-proxy`](https://github.com/http-party/node-http-proxy)。完整选项详见 [此处](https://github.com/http-party/node-http-proxy#options).
继承自 [`http-proxy`](https://github.com/http-party/node-http-proxy#options)。完整选项详见 [此处](https://github.com/vitejs/vite/blob/main/packages/vite/src/node/server/middlewares/proxy.ts#L13).

在某些情况下,你可能也想要配置底层的开发服务器。(例如添加自定义的中间件到内部的 [connect](https://github.com/senchalabs/connect) 应用中)为了实现这一点,你需要编写你自己的 [插件](/guide/using-plugins.html) 并使用 [configureServer](/guide/api-plugin.html#configureserver) 函数。

Expand Down
22 changes: 14 additions & 8 deletions guide/features.md
Original file line number Diff line number Diff line change
Expand Up @@ -113,16 +113,22 @@ Vite 默认的类型定义是写给它的 Node.js API 的。要将其补充到
- `import.meta.hot` 上的 [HMR API](./api-hmr) 类型定义

::: tip
要覆盖默认的类型定义,请在三斜线注释前添加定义。例如,要为 React 组件中的 `*.svg` 文件定义类型:
要覆盖默认的类型定义,请添加一个包含你所定义类型的文件,请在三斜线注释 reference `vite/client` 前添加定义。

```ts
declare module '*.svg' {
const content: React.FC<React.SVGProps<SVGElement>>
export default content
}
例如,要为 React 组件中的 `*.svg` 文件定义类型:

/// <reference types="vite/client" />
```
- `vite-env-override.d.ts` (the file that contains your typings):
```ts
declare module '*.svg' {
const content: React.FC<React.SVGProps<SVGElement>>
export default content
}
```
- The file containing the reference to `vite/client`:
```ts
/// <reference types="./vite-env-override.d.ts" />
/// <reference types="vite/client" />
```

:::

Expand Down
2 changes: 1 addition & 1 deletion guide/migration.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

## Rollup 3 {#rollup-3}

Vite 现在正式启用 [Rollup 3](https://github.com/vitejs/vite/issues/9870),这使得我们可以简化 Vite 内部的资源处理并同时拥有许多改进。详情请查看 [Rollup 3 版本记录](https://github.com/rollup/rollup/releases)
Vite 现在正式启用 [Rollup 3](https://github.com/vitejs/vite/issues/9870),这使得我们可以简化 Vite 内部的资源处理并同时拥有许多改进。详情请查看 [Rollup 3 版本记录](https://github.com/rollup/rollup/releases/tag/v3.0.0)

Rollup 3 尽最大可能兼容了 Rollup 2。如果你在项目中使用了自定义的 [`rollupOptions`](../config/build-options.md#rollup-options) 并(升级后)遇到了问题,请先查看 [Rollup 迁移指南](https://rollupjs.org/guide/en/#migration) 来更新升级你的配置。

Expand Down
86 changes: 52 additions & 34 deletions guide/static-deploy.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,42 +64,60 @@ $ npm run preview

2. 在你的项目中,创建一个 `deploy.sh` 脚本,包含以下内容(注意高亮的行,按需使用),运行脚本来部署站点:

```bash{16,24,27}
#!/usr/bin/env sh
# 发生错误时终止
set -e
# 构建
npm run build
# 进入构建文件夹
cd dist
# 放置 .nojekyll 以绕过 Jekyll 的处理。
echo > .nojekyll
# 如果你要部署到自定义域名
# echo 'www.example.com' > CNAME
git init
git checkout -B main
git add -A
git commit -m 'deploy'
# 如果你要部署在 https://<USERNAME>.github.io
# git push -f [email protected]:<USERNAME>/<USERNAME>.github.io.git main
# 如果你要部署在 https://<USERNAME>.github.io/<REPO>
# git push -f [email protected]:<USERNAME>/<REPO>.git main:gh-pages
cd -
```yml
# Simple workflow for deploying static content to GitHub Pages
name: Deploy static content to Pages

on:
# 仅在推送到默认分支时运行。
push:
branches: ['main']

# 这个选项可以使你手动在 Action tab 页面触发工作流
workflow_dispatch:

# 设置 GITHUB_TOKEN 的权限,以允许部署到 GitHub Pages。
permissions:
contents: read
pages: write
id-token: write

# 允许一个并发的部署
concurrency:
group: 'pages'
cancel-in-progress: true

jobs:
# 单次部署的工作描述
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v3
- name: Set up Node
uses: actions/setup-node@v3
with:
node-version: 18
cache: 'npm'
- name: Install dependencies
run: npm install
- name: Build
run: npm run build
- name: Setup Pages
uses: actions/configure-pages@v3
- name: Upload artifact
uses: actions/upload-pages-artifact@v1
with:
# Upload dist repository
path: './dist'
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v1
```
::: tip
你也可以在你的 CI 中配置该脚本,使得在每次推送代码时自动部署。
:::

## GitLab Pages 配合 GitLab CI {#gitlab-pages-and-gitlab-ci}
1. 在 `vite.config.js` 中设置正确的 `base`。
Expand Down
2 changes: 2 additions & 0 deletions guide/troubleshooting.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,8 @@
- /etc/systemd/system.conf
- /etc/systemd/user.conf

对于 Ubuntu Linux 操作系统,你可能需要添加一行 `* - nofile 65536` 到文件 `/etc/security/limits.conf` 之中,而不是更新 systemd 配置文件。

请注意,这些配置会持久作用,但需要 **重新启动**

### 网络请求停止加载 {#network-requests-stop-loading}
Expand Down
4 changes: 2 additions & 2 deletions plugins/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,11 @@ Vite 旨在为常见的 web 开发工作提供开箱即用的支持。在搜索

### [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react)

- 使用 esbuild 和 Babel,提供极速的 HMR 和一个微小体积的包脚注,同时提升灵活性,能够使用 Babel 的转换管线。
- 使用 esbuild 和 Babel,使用一个微小体积的包脚注可以实现极速的 HMR,同时提升灵活性,能够使用 Babel 的转换管线。在构建时没有使用额外的 Babel 插件,只使用了 esbuild

### [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) {#vitejsplugin-react-swc}

- 在构建时使用 esbuild,但会在开发时使用 SWC 替换 Babel。对不需要标准 React 扩展的大型项目,冷启动和模块热替换(HMR)将会有显著提升。
- 在开发时会将 Babel 替换为 SWC。在构建时,若使用了插件则会使用 SWC+esbuild,若没有使用插件则仅会用到 esbuild。对不需要标准 React 扩展的大型项目,冷启动和模块热替换(HMR)将会有显著提升。

### [@vitejs/plugin-legacy](https://github.com/vitejs/vite/tree/main/packages/plugin-legacy) {#vitejsplugin-legacy}

Expand Down

1 comment on commit 8920fbc

@vercel
Copy link

@vercel vercel bot commented on 8920fbc Feb 19, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

cn-vitejs-dev – ./

docs-cn.vercel.app
cn-vitejs-dev-vuejs.vercel.app
cn-vitejs-dev-git-main-vuejs.vercel.app
cn.vitejs.dev

Please sign in to comment.