Merge branch 'main' into fix/issue-5767

.eslintrc.js → .eslintrc.cjs

@@ -89,7 +89,11 @@ module.exports = defineConfig({
     '@typescript-eslint/no-inferrable-types': 'off',
     '@typescript-eslint/no-non-null-assertion': 'off', // maybe we should turn this on in a new PR
     '@typescript-eslint/no-unused-vars': 'off', // maybe we should turn this on in a new PR
-    '@typescript-eslint/no-var-requires': 'off'
+    '@typescript-eslint/no-var-requires': 'off',
+    '@typescript-eslint/consistent-type-imports': [
+      'error',
+      { prefer: 'type-imports' }
+    ]
   },
   overrides: [
     {

.github/workflows/ci.yml

@@ -14,6 +14,10 @@ on:
   pull_request:
   workflow_dispatch:
 
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.number || github.sha }}
+  cancel-in-progress: true
+
 jobs:
   build:
     runs-on: ${{ matrix.os }}
@@ -91,3 +95,6 @@ jobs:
 
       - name: Lint
         run: pnpm run lint
+
+      - name: Check formatting
+        run: pnpm prettier --check .

.github/workflows/release-tag.yml

@@ -0,0 +1,40 @@
+name: release
+
+on:
+  push:
+    tags:
+      - "v*" # Push events to matching v*, i.e. v1.0, v20.15.10
+      - "plugin-*" # Push events to matching plugin-*, i.e. plugin-(vue|vue-jsx|react|legacy)@1.0.0
+      - "create-vite*" # # Push events to matching create-vite*, i.e. create-vite@1.0.0
+
+# $GITHUB_REF_NAME - https://docs.github.com/en/actions/learn-github-actions/environment-variables#default-environment-variables
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+
+      - name: Get pkgName for tag
+        id: tag
+        run: |
+          # matching v2.0.0 / v2.0.0-beta.8 etc
+          if [[ $GITHUB_REF_NAME =~ ^v.+ ]]; then
+            pkgName="vite"
+          else
+            # `%@*` truncates @ and version number from the right side.
+            # https://stackoverflow.com/questions/9532654/expression-after-last-specific-character
+            pkgName=${GITHUB_REF_NAME%@*}
+          fi
+
+          echo "::set-output name=pkgName::$pkgName"
+
+      - name: Create Release for Tag
+        id: release_tag
+        uses: yyx990803/release-tag@master
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          tag_name: ${{ github.ref }}
+          body: |
+            Please refer to [CHANGELOG.md](https://github.com/vitejs/vite/blob/${{ github.ref_name }}/packages/${{ steps.tag.outputs.pkgName }}/CHANGELOG.md) for details.

.gitignore

@@ -10,4 +10,4 @@ explorations
 *.local
 /packages/vite/LICENSE
 *.cpuprofile
-/.vscode/
+/.vscode/

CONTRIBUTING.md

@@ -12,24 +12,24 @@ To develop and test the core `vite` package:
 
 2. Go to `packages/vite` and run `pnpm run dev`. This starts `rollup` in watch mode.
 
-3. Run `pnpm link --global` in `packages/vite`. This links `vite` globally so that you can:
-
-   - Run `pnpm link --global vite` in another Vite project to use the locally built Vite;
-   - Use the `vite` binary anywhere.
-
-   If your project has `vite` as a nested dependency, you can customize the dependency resolution instead depending on the package manager used. For pnpm, add this in your project's root `package.json`:
-
-   ```json
-   {
-     "pnpm": {
-       "overrides": {
-         "vite": "link:../path/to/vite/packages/vite"
-       }
-     }
-   }
-   ```
+## Testing Vite against external packages
+
+You may wish to test your locally-modified copy of Vite against another package that is built with Vite. For pnpm, after building Vite, you can use [`pnpm.overrides`](https://pnpm.io/package_json#pnpmoverrides). Please note that `pnpm.overrides` must be specified in the root `package.json` and you must first list the package as a dependency in the root `package.json`:
+
+```json
+{
+  "dependencies": {
+    "vite": "^2.0.0"
+  },
+  "pnpm": {
+    "overrides": {
+      "vite": "link:../path/to/vite/packages/vite"
+    }
+  }
+}
+```
 
-   And re-run `pnpm install` to link the package.
+And re-run `pnpm install` to link the package.
 
 ## Running Tests
 
@@ -100,7 +100,7 @@ To work around this, playground packages that uses the `file:` protocol should a
 ```jsonc
 "scripts": {
   //...
-  "postinstall": "node ../../../scripts/patchFileDeps"
+  "postinstall": "ts-node ../../../scripts/patchFileDeps.ts"
 }
 ```
 

docs/.vitepress/theme/sponsors.json

@@ -35,5 +35,11 @@
     "name": "divriots",
     "href": "https://divriots.com/",
     "src": "/divriots.png"
+  },
+  {
+    "id": "finclip",
+    "name": "FinClip",
+    "href": "https://finclip.com/?from=vite",
+    "src": "/finclip.png"
   }
 ]

docs/config/index.md

@@ -236,9 +236,14 @@ export default defineConfig(async ({ command, mode }) => {
       | ((name: string, filename: string, css: string) => string)
     hashPrefix?: string
     /**
-     * default: 'camelCaseOnly'
+     * default: null
      */
-    localsConvention?: 'camelCase' | 'camelCaseOnly' | 'dashes' | 'dashesOnly'
+    localsConvention?:
+      | 'camelCase'
+      | 'camelCaseOnly'
+      | 'dashes'
+      | 'dashesOnly'
+      | null
   }
   ```
 
@@ -786,12 +791,12 @@ export default defineConfig({
 
   By default, Vite will empty the `outDir` on build if it is inside project root. It will emit a warning if `outDir` is outside of root to avoid accidentally removing important files. You can explicitly set this option to suppress the warning. This is also available via command line as `--emptyOutDir`.
 
-### build.brotliSize
+### build.reportCompressedSize
 
 - **Type:** `boolean`
 - **Default:** `true`
 
-  Enable/disable brotli-compressed size reporting. Compressing large output files can be slow, so disabling this may increase build performance for large projects.
+  Enable/disable gzip-compressed size reporting. Compressing large output files can be slow, so disabling this may increase build performance for large projects.
 
 ### build.chunkSizeWarningLimit
 
@@ -915,14 +920,17 @@ export default defineConfig({
 
   By default, linked packages not inside `node_modules` are not pre-bundled. Use this option to force a linked package to be pre-bundled.
 
-### optimizeDeps.keepNames
+### optimizeDeps.esbuildOptions
 
-- **Type:** `boolean`
-- **Default:** `false`
+- **Type:** [`EsbuildBuildOptions`](https://esbuild.github.io/api/#simple-options)
+
+  Options to pass to esbuild during the dep scanning and optimization.
+
+  Certain options are omitted since changing them would not be compatible with Vite's dep optimization.
 
-  The bundler sometimes needs to rename symbols to avoid collisions.
-  Set this to `true` to keep the `name` property on functions and classes.
-  See [`keepNames`](https://esbuild.github.io/api/#keep-names).
+  - `external` is also omitted, use Vite's `optimizeDeps.exclude` option
+  - `plugins` are merged with Vite's dep plugin
+  - `keepNames` takes precedence over the deprecated `optimizeDeps.keepNames`
 
 ## SSR Options
 

docs/guide/api-plugin.md

@@ -40,7 +40,6 @@ Vite convention for virtual modules is to prefix the user-facing path with `virt
 
 Note that modules directly derived from a real file, as in the case of a script module in a Single File Component (like a .vue or .svelte SFC) don't need to follow this convention. SFCs generally generate a set of submodules when processed but the code in these can be mapped back to the filesystem. Using `\0` for these submodules would prevent sourcemaps from working correctly.
 
-
 ## Plugins config
 
 Users will add plugins to the project `devDependencies` and configure them using the `plugins` array option.

docs/guide/backend-integration.md

@@ -39,7 +39,7 @@ If you need a custom integration, you can follow the steps in this guide to conf
 
    Also make sure the server is configured to serve static assets in the Vite working directory, otherwise assets such as images won't be loaded properly.
 
-   Note if you are using React with `@vitejs/plugin-react-refresh`, you'll also need to add this before the above scripts, since the plugin is not able to modify the HTML you are serving:
+   Note if you are using React with `@vitejs/plugin-react`, you'll also need to add this before the above scripts, since the plugin is not able to modify the HTML you are serving:
 
    ```html
    <script type="module">

docs/guide/features.md

@@ -296,6 +296,7 @@ Note that:
 - The glob patterns are treated like import specifiers: they must be either relative (start with `./`) or absolute (start with `/`, resolved relative to project root).
 - The glob matching is done via `fast-glob` - check out its documentation for [supported glob patterns](https://github.com/mrmlnc/fast-glob#pattern-syntax).
 - You should also be aware that glob imports do not accept variables, you need to directly pass the string pattern.
+- The glob patterns cannot contain the same quote string (i.e. `'`, `"`, `` ` ``) as outer quotes, e.g. `'/Tom\'s files/**'`, use `"/Tom's files/**"` instead.
 
 ## WebAssembly
 

docs/guide/index.md

@@ -38,7 +38,7 @@ The supported template presets are:
 ## Scaffolding Your First Vite Project
 
 ::: tip Compatibility Note
-Vite requires [Node.js](https://nodejs.org/en/) version >=12.0.0.
+Vite requires [Node.js](https://nodejs.org/en/) version >=12.2.0. However, some templates require a higher Node.js version to work, please upgrade if your package manager warns about it.
 :::
 
 With NPM:
@@ -115,7 +115,8 @@ Running `vite` starts the dev server using the current working directory as root
 
 In a project where Vite is installed, you can use the `vite` binary in your npm scripts, or run it directly with `npx vite`. Here is the default npm scripts in a scaffolded Vite project:
 
-```jsonc
+<!-- prettier-ignore -->
+```json5
 {
   "scripts": {
     "dev": "vite", // start dev server, aliases: `vite dev`, `vite serve`

docs/guide/migration.md

@@ -91,7 +91,7 @@ export default defineConfig({
 
 ## React Support
 
-React Fast Refresh support is now provided via [`@vitejs/plugin-react-refresh`](https://github.com/vitejs/vite/tree/main/packages/plugin-react-refresh).
+React Fast Refresh support is now provided via [`@vitejs/plugin-react`](https://github.com/vitejs/vite/tree/main/packages/plugin-react).
 
 ## HMR API Change
 

docs/guide/ssr.md

@@ -31,6 +31,7 @@ A typical SSR application will have the following source file structure:
 
 ```
 - index.html
+- server.js # main application server
 - src/
   - main.js          # exports env-agnostic (universal) app code
   - entry-client.js  # mounts the app to a DOM element
@@ -76,8 +77,8 @@ async function createServer() {
   // Create Vite server in middleware mode. This disables Vite's own HTML
   // serving logic and let the parent server take control.
   //
-  // If you want to use Vite's own HTML serving logic (using Vite as
-  // a development middleware), using 'html' instead.
+  // In middleware mode, if you want to use Vite's own HTML serving logic
+  // use `'html'` as the `middlewareMode` (ref https://vitejs.dev/config/#server-middlewaremode)
   const vite = await createViteServer({
     server: { middlewareMode: 'ssr' }
   })
@@ -111,7 +112,7 @@ app.use('*', async (req, res) => {
 
     // 2. Apply Vite HTML transforms. This injects the Vite HMR client, and
     //    also applies HTML transforms from Vite plugins, e.g. global preambles
-    //    from @vitejs/plugin-react-refresh
+    //    from @vitejs/plugin-react
     template = await vite.transformIndexHtml(url, template)
 
     // 3. Load the server entry. vite.ssrLoadModule automatically transforms
@@ -250,7 +251,7 @@ export function mySSRPlugin() {
 
 The options object in `load` and `transform` is optional, rollup is not currently using this object but may extend these hooks with additional metadata in the future.
 
-::: note
+:::tip Note
 Before Vite 2.7, this was informed to plugin hooks with a positional `ssr` param instead of using the `options` object. All major frameworks and plugins are updated but you may find outdated posts using the previous API.
 :::
 

docs/guide/static-deploy.md

@@ -87,7 +87,7 @@ Now the `preview` method will launch the server at http://localhost:8080.
    # git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git main
 
    # if you are deploying to https://<USERNAME>.github.io/<REPO>
-   # git push -f git@github.com:<USERNAME>/<REPO>.git master:gh-pages
+   # git push -f git@github.com:<USERNAME>/<REPO>.git main:gh-pages
 
    cd -
    ```
@@ -127,7 +127,7 @@ You can also run the above script in your CI setup to enable automatic deploymen
      github_token: $GITHUB_TOKEN
      keep_history: true
      on:
-       branch: master
+       branch: main
    ```
 
 ## GitLab Pages and GitLab CI
@@ -159,7 +159,7 @@ You can also run the above script in your CI setup to enable automatic deploymen
        paths:
          - public
      rules:
-       - $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
+       - if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
    ```
 
 ## Netlify
@@ -259,7 +259,7 @@ You can also deploy to a [custom domain](http://surge.sh/help/adding-a-custom-do
 
    ```bash
    # publish site
-   $ git push heroku master
+   $ git push heroku main
 
    # opens a browser to view the Dashboard version of Heroku CI
    $ heroku open

jest.config.ts

@@ -7,9 +7,9 @@ const config: Config.InitialOptions = {
     ? ['**/playground/**/*.spec.[jt]s?(x)']
     : ['**/*.spec.[jt]s?(x)'],
   testTimeout: process.env.CI ? 30000 : 10000,
-  globalSetup: './scripts/jestGlobalSetup.js',
-  globalTeardown: './scripts/jestGlobalTeardown.js',
-  testEnvironment: './scripts/jestEnv.js',
+  globalSetup: './scripts/jestGlobalSetup.cjs',
+  globalTeardown: './scripts/jestGlobalTeardown.cjs',
+  testEnvironment: './scripts/jestEnv.cjs',
   setupFilesAfterEnv: ['./scripts/jestPerTestSetup.ts'],
   watchPathIgnorePatterns: ['<rootDir>/packages/temp'],
   modulePathIgnorePatterns: ['<rootDir>/packages/temp'],