From 897f69f9b6fd3726a93c35a3a57c8cab8379711f Mon Sep 17 00:00:00 2001
From: Bjorn Lu <bjornlu.dev@gmail.com>
Date: Fri, 9 Dec 2022 22:40:27 +0800
Subject: [PATCH] docs: add env var section (#11286)

---
 docs/.vitepress/config.ts     |  2 +-
 docs/blog/announcing-vite4.md | 15 +++++++++++++--
 docs/guide/migration.md       | 13 +++++++++----
 3 files changed, 23 insertions(+), 7 deletions(-)

diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts
index 8fc6321f1..12cf7d0a8 100644
--- a/docs/.vitepress/config.ts
+++ b/docs/.vitepress/config.ts
@@ -238,7 +238,7 @@ export default defineConfig({
               link: '/guide/troubleshooting',
             },
             {
-              text: 'Migration from v2',
+              text: 'Migration from v3',
               link: '/guide/migration',
             },
           ],
diff --git a/docs/blog/announcing-vite4.md b/docs/blog/announcing-vite4.md
index 4303c9650..90140a80d 100644
--- a/docs/blog/announcing-vite4.md
+++ b/docs/blog/announcing-vite4.md
@@ -71,7 +71,7 @@ Note that Vite starter templates are intended to be used as a playground to test
 
 The modern browser build now targets `safari14` by default for wider ES2020 compatibility. This means that modern builds can now use [`BigInt`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt) and that the [nullish coalescing operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing) isn't transpiled anymore. If you need to support older browsers, you can add [`@vitejs/plugin-legacy`](https://github.com/vitejs/vite/tree/main/packages/plugin-legacy) as usual.
 
-## Importing CSS as a string
+## Importing CSS as a String
 
 In Vite 3, importing the default export of a `.css` file could introduce a double loading of CSS.
 
@@ -87,7 +87,18 @@ import stuff from './global.css?inline'
 
 Learn more in the [Migration Guide](/guide/migration).
 
-## Other features
+## Environment Variables
+
+Vite now uses `dotenv` 16 and `dotenv-expand` 9 (previously `dotenv` 14 and `dotenv-expand` 5). If you have a value including `#` or `` ` ``, you will need to wrap them with quotes.
+
+```diff
+-VITE_APP=ab#cd`ef
++VITE_APP="ab#cd`ef"
+```
+
+For more details, see the [`dotenv`](https://github.com/motdotla/dotenv/blob/master/CHANGELOG.md) and [`dotenv-expand` changelog](https://github.com/motdotla/dotenv-expand/blob/master/CHANGELOG.md).
+
+## Other Features
 
 - CLI Shortcuts (press `h` during dev to see them all) ([#11228](https://github.com/vitejs/vite/pull/11228))
 - Support for patch-package when pre bundling dependencies ([#10286](https://github.com/vitejs/vite/issues/10286))
diff --git a/docs/guide/migration.md b/docs/guide/migration.md
index b967b584b..a94737aad 100644
--- a/docs/guide/migration.md
+++ b/docs/guide/migration.md
@@ -16,7 +16,7 @@ The modern browser build now targets `safari14` by default for wider ES2020 comp
 
 The build default charset is now utf8 (see [#10753](https://github.com/vitejs/vite/issues/10753) for details).
 
-### Importing CSS as a string
+### Importing CSS as a String
 
 In Vite 3, importing the default export of a `.css` file could introduce a double loading of CSS.
 
@@ -30,11 +30,16 @@ This double loading could occur since a `.css` file will be emitted and it's lik
 import stuff from './global.css?inline'
 ```
 
-### `dotenv` update
+### Environment Variables
 
-Vite is now using dotenv 16 and dotenv-expand 9 (previously dotenv 14 and dotenv-expand 5).
+Vite now uses `dotenv` 16 and `dotenv-expand` 9 (previously `dotenv` 14 and `dotenv-expand` 5). If you have a value including `#` or `` ` ``, you will need to wrap them with quotes.
 
-If you have a value including `#` or `` ` ``, you will need to wrap them with quotes. See their changelog for more details ([`dotenv`](https://github.com/motdotla/dotenv/blob/master/CHANGELOG.md), [`dotenv-expand`](https://github.com/motdotla/dotenv-expand/blob/master/CHANGELOG.md)).
+```diff
+-VITE_APP=ab#cd`ef
++VITE_APP="ab#cd`ef"
+```
+
+For more details, see the [`dotenv`](https://github.com/motdotla/dotenv/blob/master/CHANGELOG.md) and [`dotenv-expand` changelog](https://github.com/motdotla/dotenv-expand/blob/master/CHANGELOG.md).
 
 ## Advanced