From 0ba50db1bf3fac9d6e16a6d68f23e2c47ba53a81 Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sat, 21 Aug 2021 17:54:00 +0800
Subject: [PATCH 01/10] feat(vite): allow custom vite env prefix close #4194

---
 .../vite/src/node/__tests__/config.spec.ts    | 24 ++++++++++-
 packages/vite/src/node/config.ts              | 41 ++++++++++++++++---
 packages/vite/src/node/utils.ts               |  4 ++
 3 files changed, 62 insertions(+), 7 deletions(-)

diff --git a/packages/vite/src/node/__tests__/config.spec.ts b/packages/vite/src/node/__tests__/config.spec.ts
index 450e74aeee4bb5..d4425a5bc70812 100644
--- a/packages/vite/src/node/__tests__/config.spec.ts
+++ b/packages/vite/src/node/__tests__/config.spec.ts
@@ -1,5 +1,10 @@
 import { InlineConfig } from '..'
-import { mergeConfig, resolveConfig, UserConfigExport } from '../config'
+import {
+  mergeConfig,
+  resolveConfig,
+  UserConfigExport,
+  resolveEnvVariblePrefix
+} from '../config'
 
 describe('mergeConfig', () => {
   test('handles configs with different alias schemas', () => {
@@ -139,3 +144,20 @@ describe('resolveConfig', () => {
     })
   })
 })
+
+describe('resolveEnvVariblePrefix', () => {
+  test(`use 'VITE_' as default value for undefined`, () => {
+    const config: UserConfigExport = {}
+    expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
+  })
+  test(`use 'VITE_' as fallback value for plain empty prefix `, () => {
+    let config: UserConfigExport = { envVariblePrefix: '' }
+    expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
+    config = { envVariblePrefix: ' ' }
+    expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
+  })
+  test('ignored empty value for arraify prefix', () => {
+    const config: UserConfigExport = { envVariblePrefix: ['', ' ', 'CUSTOM_'] }
+    expect(resolveEnvVariblePrefix(config)).toMatchObject(['CUSTOM_'])
+  })
+})
diff --git a/packages/vite/src/node/config.ts b/packages/vite/src/node/config.ts
index cd1d801fb8388d..6ab308ee902ca4 100644
--- a/packages/vite/src/node/config.ts
+++ b/packages/vite/src/node/config.ts
@@ -9,6 +9,7 @@ import {
 } from './server'
 import { CSSOptions } from './plugins/css'
 import {
+  arraify,
   createDebugger,
   isExternalUrl,
   isObject,
@@ -170,6 +171,11 @@ export interface UserConfig {
    * @default root
    */
   envDir?: string
+  /**
+   * Env variables starts envVariblePrefix exposed to your client source code via import.meta.env.
+   * @default 'VITE_'
+   */
+  envVariblePrefix?: string | string[]
   /**
    * Import aliases
    * @deprecated use `resolve.alias` instead
@@ -328,7 +334,9 @@ export async function resolveConfig(
   const envDir = config.envDir
     ? normalizePath(path.resolve(resolvedRoot, config.envDir))
     : resolvedRoot
-  const userEnv = inlineConfig.envFile !== false && loadEnv(mode, envDir)
+  const userEnv =
+    inlineConfig.envFile !== false &&
+    loadEnv(mode, envDir, resolveEnvVariblePrefix(config))
 
   // Note it is possible for user to have a custom mode, e.g. `staging` where
   // production-like behavior is expected. This is indicated by NODE_ENV=production
@@ -947,7 +955,7 @@ async function loadConfigFromBundledFile(
 export function loadEnv(
   mode: string,
   envDir: string,
-  prefix = 'VITE_'
+  prefixes: string[]
 ): Record<string, string> {
   if (mode === 'local') {
     throw new Error(
@@ -955,7 +963,6 @@ export function loadEnv(
         `the .local postfix for .env files.`
     )
   }
-
   const env: Record<string, string> = {}
   const envFiles = [
     /** mode local file */ `.env.${mode}.local`,
@@ -967,7 +974,10 @@ export function loadEnv(
   // check if there are actual env variables starting with VITE_*
   // these are typically provided inline and should be prioritized
   for (const key in process.env) {
-    if (key.startsWith(prefix) && env[key] === undefined) {
+    if (
+      prefixes.some((prefix) => key.startsWith(prefix)) &&
+      env[key] === undefined
+    ) {
       env[key] = process.env[key] as string
     }
   }
@@ -988,7 +998,10 @@ export function loadEnv(
 
       // only keys that start with prefix are exposed to client
       for (const [key, value] of Object.entries(parsed)) {
-        if (key.startsWith(prefix) && env[key] === undefined) {
+        if (
+          prefixes.some((prefix) => key.startsWith(prefix)) &&
+          env[key] === undefined
+        ) {
           env[key] = value
         } else if (key === 'NODE_ENV') {
           // NODE_ENV override in .env file
@@ -997,6 +1010,22 @@ export function loadEnv(
       }
     }
   }
-
   return env
 }
+
+export function resolveEnvVariblePrefix({
+  envVariblePrefix = 'VITE_'
+}: UserConfig): string[] {
+  if (
+    typeof envVariblePrefix === 'string' &&
+    envVariblePrefix.trim().length === 0
+  ) {
+    // TODO: warn or error?
+    envVariblePrefix = 'VITE_'
+  }
+  envVariblePrefix = arraify(envVariblePrefix).filter(
+    (prefix) => prefix.trim() !== ''
+  )
+
+  return envVariblePrefix
+}
diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts
index 305e08ce37796a..56baeedb884f8a 100644
--- a/packages/vite/src/node/utils.ts
+++ b/packages/vite/src/node/utils.ts
@@ -512,3 +512,7 @@ export function resolveHostname(
 
   return { host, name }
 }
+
+export function arraify<T>(target: T | T[]): T[] {
+  return Array.isArray(target) ? target : [target]
+}

From f992439b0236635e5c1ecb47e9e135f1c150b216 Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sat, 21 Aug 2021 22:26:46 +0800
Subject: [PATCH 02/10] wip: add e2e test

---
 packages/playground/env/.env                  | 1 +
 packages/playground/env/__tests__/env.spec.ts | 5 +++++
 packages/playground/env/index.html            | 2 ++
 packages/playground/env/vite.config.js        | 5 +++++
 4 files changed, 13 insertions(+)
 create mode 100644 packages/playground/env/vite.config.js

diff --git a/packages/playground/env/.env b/packages/playground/env/.env
index 7dc2f2192b70ec..ad0e78511b8662 100644
--- a/packages/playground/env/.env
+++ b/packages/playground/env/.env
@@ -1,2 +1,3 @@
 VITE_CUSTOM_ENV_VARIABLE=1
+CUSTOM_PREFIX_ENV_VARIABLE=1
 VITE_EFFECTIVE_MODE_FILE_NAME=.env
\ No newline at end of file
diff --git a/packages/playground/env/__tests__/env.spec.ts b/packages/playground/env/__tests__/env.spec.ts
index f2c265d825ed80..907cebc8037ce9 100644
--- a/packages/playground/env/__tests__/env.spec.ts
+++ b/packages/playground/env/__tests__/env.spec.ts
@@ -22,6 +22,10 @@ test('custom', async () => {
   expect(await page.textContent('.custom')).toBe('1')
 })
 
+test('custom-prefix', async () => {
+  expect(await page.textContent('.custom-prefix')).toBe('1')
+})
+
 test('mode file override', async () => {
   expect(await page.textContent('.mode-file')).toBe(`.env.${mode}`)
 })
@@ -40,6 +44,7 @@ test('env object', async () => {
   const envText = await page.textContent('.env-object')
   expect(JSON.parse(envText)).toMatchObject({
     VITE_EFFECTIVE_MODE_FILE_NAME: `.env.${mode}`,
+    CUSTOM_PREFIX_ENV_VARIABLE: '1',
     VITE_CUSTOM_ENV_VARIABLE: '1',
     BASE_URL: '/',
     MODE: mode,
diff --git a/packages/playground/env/index.html b/packages/playground/env/index.html
index 202a0fae9a3624..77b3f7da5f5105 100644
--- a/packages/playground/env/index.html
+++ b/packages/playground/env/index.html
@@ -4,6 +4,7 @@ <h1>Environment Variables</h1>
 <p>import.meta.env.DEV: <code class="dev"></code></p>
 <p>import.meta.env.PROD: <code class="prod"></code></p>
 <p>import.meta.env.VITE_CUSTOM_ENV_VARIABLE: <code class="custom"></code></p>
+<p>import.meta.env.CUSTOM_PREFIX_ENV_VARIABLE: <code class="custom-prefix"></code></p>
 <p>
   import.meta.env.VITE_EFFECTIVE_MODE_FILE_NAME: <code class="mode-file"></code>
 </p>
@@ -17,6 +18,7 @@ <h1>Environment Variables</h1>
   text('.dev', import.meta.env.DEV)
   text('.prod', import.meta.env.PROD)
   text('.custom', import.meta.env.VITE_CUSTOM_ENV_VARIABLE)
+  text('.custom-prefix', import.meta.env.CUSTOM_PREFIX_ENV_VARIABLE)
   text('.mode-file', import.meta.env.VITE_EFFECTIVE_MODE_FILE_NAME)
   text('.inline', import.meta.env.VITE_INLINE)
   text('.node-env', process.env.NODE_ENV)
diff --git a/packages/playground/env/vite.config.js b/packages/playground/env/vite.config.js
new file mode 100644
index 00000000000000..38d065956aba33
--- /dev/null
+++ b/packages/playground/env/vite.config.js
@@ -0,0 +1,5 @@
+const { defineConfig } = require('vite')
+
+module.exports = defineConfig({
+  envVariblePrefix: ['VITE_', 'CUSTOM_PREFIX_']
+})

From 5fdcf8917250631461fa6b7e251732bb63c379b8 Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sat, 21 Aug 2021 22:42:48 +0800
Subject: [PATCH 03/10] wip: throw error for '' value

---
 .../vite/src/node/__tests__/config.spec.ts    | 21 ++++++++++---------
 packages/vite/src/node/config.ts              | 15 +++++--------
 2 files changed, 16 insertions(+), 20 deletions(-)

diff --git a/packages/vite/src/node/__tests__/config.spec.ts b/packages/vite/src/node/__tests__/config.spec.ts
index d4425a5bc70812..7fa7d0f9290557 100644
--- a/packages/vite/src/node/__tests__/config.spec.ts
+++ b/packages/vite/src/node/__tests__/config.spec.ts
@@ -3,7 +3,8 @@ import {
   mergeConfig,
   resolveConfig,
   UserConfigExport,
-  resolveEnvVariblePrefix
+  resolveEnvVariblePrefix,
+  UserConfig
 } from '../config'
 
 describe('mergeConfig', () => {
@@ -147,17 +148,17 @@ describe('resolveConfig', () => {
 
 describe('resolveEnvVariblePrefix', () => {
   test(`use 'VITE_' as default value for undefined`, () => {
-    const config: UserConfigExport = {}
+    const config: UserConfig = {}
     expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
   })
-  test(`use 'VITE_' as fallback value for plain empty prefix `, () => {
-    let config: UserConfigExport = { envVariblePrefix: '' }
-    expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
-    config = { envVariblePrefix: ' ' }
-    expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
+  test(`throw error if envVariblePrefix contains ''`, () => {
+    let config: UserConfig = { envVariblePrefix: '' }
+    expect(() => resolveEnvVariblePrefix(config)).toThrow()
+    config = { envVariblePrefix: ['', 'CUSTOM_'] }
+    expect(() => resolveEnvVariblePrefix(config)).toThrow()
   })
-  test('ignored empty value for arraify prefix', () => {
-    const config: UserConfigExport = { envVariblePrefix: ['', ' ', 'CUSTOM_'] }
-    expect(resolveEnvVariblePrefix(config)).toMatchObject(['CUSTOM_'])
+  test('should work correctly for valid envVariblePrefix value', () => {
+    const config: UserConfig = { envVariblePrefix: [' ', 'CUSTOM_'] }
+    expect(resolveEnvVariblePrefix(config)).toMatchObject([' ', 'CUSTOM_'])
   })
 })
diff --git a/packages/vite/src/node/config.ts b/packages/vite/src/node/config.ts
index 6ab308ee902ca4..b0752134f54616 100644
--- a/packages/vite/src/node/config.ts
+++ b/packages/vite/src/node/config.ts
@@ -1016,16 +1016,11 @@ export function loadEnv(
 export function resolveEnvVariblePrefix({
   envVariblePrefix = 'VITE_'
 }: UserConfig): string[] {
-  if (
-    typeof envVariblePrefix === 'string' &&
-    envVariblePrefix.trim().length === 0
-  ) {
-    // TODO: warn or error?
-    envVariblePrefix = 'VITE_'
+  envVariblePrefix = arraify(envVariblePrefix)
+  if (envVariblePrefix.some((prefix) => prefix === '')) {
+    throw new Error(
+      `Unexpected envVariblePrefix '', which could lead unexpected exposure of sensitive information.`
+    )
   }
-  envVariblePrefix = arraify(envVariblePrefix).filter(
-    (prefix) => prefix.trim() !== ''
-  )
-
   return envVariblePrefix
 }

From 3bbce78bf22cb64b01e01ea54e1fcbd4c849c9dc Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sat, 21 Aug 2021 22:43:48 +0800
Subject: [PATCH 04/10] wip: format

---
 packages/vite/src/node/__tests__/config.spec.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/vite/src/node/__tests__/config.spec.ts b/packages/vite/src/node/__tests__/config.spec.ts
index 7fa7d0f9290557..b795abee0ce08a 100644
--- a/packages/vite/src/node/__tests__/config.spec.ts
+++ b/packages/vite/src/node/__tests__/config.spec.ts
@@ -151,12 +151,14 @@ describe('resolveEnvVariblePrefix', () => {
     const config: UserConfig = {}
     expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
   })
+
   test(`throw error if envVariblePrefix contains ''`, () => {
     let config: UserConfig = { envVariblePrefix: '' }
     expect(() => resolveEnvVariblePrefix(config)).toThrow()
     config = { envVariblePrefix: ['', 'CUSTOM_'] }
     expect(() => resolveEnvVariblePrefix(config)).toThrow()
   })
+
   test('should work correctly for valid envVariblePrefix value', () => {
     const config: UserConfig = { envVariblePrefix: [' ', 'CUSTOM_'] }
     expect(resolveEnvVariblePrefix(config)).toMatchObject([' ', 'CUSTOM_'])

From 25055de227b7ffac6f9f79632f7307915300befc Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sat, 21 Aug 2021 23:01:16 +0800
Subject: [PATCH 05/10] wip: 1.fix typo 2.docs

---
 docs/config/index.md             | 12 ++++++++++++
 docs/guide/env-and-mode.md       |  2 ++
 packages/vite/src/node/config.ts |  2 +-
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/docs/config/index.md b/docs/config/index.md
index e7043a5145cc30..43c616da0b7012 100644
--- a/docs/config/index.md
+++ b/docs/config/index.md
@@ -333,6 +333,18 @@ export default defineConfig(async ({ command, mode }) => {
 
   See [here](/guide/env-and-mode#env-files) for more about environment files.
 
+### envVariblePrefix
+
+- **Type:** `string | string[]`
+- **Default:** `VITE_`
+
+  Env variables starts `envVariblePrefix` will be exposed to your client source code via import.meta.env.
+
+:::warning SECURITY NOTES
+
+- `envVariblePrefix` should not be set as `''`, which will expose all your env variables and cause unexpected leaking of of sensitive information. Vite will throw error when detecting `''`.
+  :::
+
 ## Server Options
 
 ### server.host
diff --git a/docs/guide/env-and-mode.md b/docs/guide/env-and-mode.md
index 85ff820b1d05db..c55d2263d67dcd 100644
--- a/docs/guide/env-and-mode.md
+++ b/docs/guide/env-and-mode.md
@@ -44,6 +44,8 @@ VITE_SOME_KEY=123
 
 Only `VITE_SOME_KEY` will be exposed as `import.meta.env.VITE_SOME_KEY` to your client source code, but `DB_PASSWORD` will not.
 
+If you want to custmize env variables prefix, see [envVariblePrefix](/config/index#envVariblePrefix) option.
+
 :::warning SECURITY NOTES
 
 - `.env.*.local` files are local-only and can contain sensitive variables. You should add `.local` to your `.gitignore` to avoid them being checked into git.
diff --git a/packages/vite/src/node/config.ts b/packages/vite/src/node/config.ts
index b0752134f54616..99436a733c94a0 100644
--- a/packages/vite/src/node/config.ts
+++ b/packages/vite/src/node/config.ts
@@ -172,7 +172,7 @@ export interface UserConfig {
    */
   envDir?: string
   /**
-   * Env variables starts envVariblePrefix exposed to your client source code via import.meta.env.
+   * Env variables starts envVariblePrefix will be exposed to your client source code via import.meta.env.
    * @default 'VITE_'
    */
   envVariblePrefix?: string | string[]

From 6f308e45eb0b47ea84bf874c521be58ebf4bae18 Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sat, 21 Aug 2021 23:08:54 +0800
Subject: [PATCH 06/10] wip: fix typo

---
 docs/guide/env-and-mode.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/guide/env-and-mode.md b/docs/guide/env-and-mode.md
index c55d2263d67dcd..0dabd438d4cab8 100644
--- a/docs/guide/env-and-mode.md
+++ b/docs/guide/env-and-mode.md
@@ -44,7 +44,7 @@ VITE_SOME_KEY=123
 
 Only `VITE_SOME_KEY` will be exposed as `import.meta.env.VITE_SOME_KEY` to your client source code, but `DB_PASSWORD` will not.
 
-If you want to custmize env variables prefix, see [envVariblePrefix](/config/index#envVariblePrefix) option.
+If you want to customize env variables prefix, see [envVariblePrefix](/config/index#envVariblePrefix) option.
 
 :::warning SECURITY NOTES
 

From 0d416274381f93f92dbc572b1a6d05c14ab6e6e0 Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sat, 21 Aug 2021 23:13:10 +0800
Subject: [PATCH 07/10] wip: docs

---
 packages/vite/src/node/__tests__/config.spec.ts | 2 +-
 packages/vite/src/node/config.ts                | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/vite/src/node/__tests__/config.spec.ts b/packages/vite/src/node/__tests__/config.spec.ts
index b795abee0ce08a..b16818024e966a 100644
--- a/packages/vite/src/node/__tests__/config.spec.ts
+++ b/packages/vite/src/node/__tests__/config.spec.ts
@@ -147,7 +147,7 @@ describe('resolveConfig', () => {
 })
 
 describe('resolveEnvVariblePrefix', () => {
-  test(`use 'VITE_' as default value for undefined`, () => {
+  test(`use 'VITE_' as default value`, () => {
     const config: UserConfig = {}
     expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
   })
diff --git a/packages/vite/src/node/config.ts b/packages/vite/src/node/config.ts
index 99436a733c94a0..e5d1a30c0901df 100644
--- a/packages/vite/src/node/config.ts
+++ b/packages/vite/src/node/config.ts
@@ -172,7 +172,7 @@ export interface UserConfig {
    */
   envDir?: string
   /**
-   * Env variables starts envVariblePrefix will be exposed to your client source code via import.meta.env.
+   * Env variables starts `envVariblePrefix` will be exposed to your client source code via import.meta.env.
    * @default 'VITE_'
    */
   envVariblePrefix?: string | string[]
@@ -1019,7 +1019,7 @@ export function resolveEnvVariblePrefix({
   envVariblePrefix = arraify(envVariblePrefix)
   if (envVariblePrefix.some((prefix) => prefix === '')) {
     throw new Error(
-      `Unexpected envVariblePrefix '', which could lead unexpected exposure of sensitive information.`
+      `envVariblePrefix option contains value '', which could lead unexpected exposure of sensitive information.`
     )
   }
   return envVariblePrefix

From 96cedc1c09ad951cdd6f8b143a159c484e632ead Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sun, 22 Aug 2021 01:19:37 +0800
Subject: [PATCH 08/10] wip: fix typo

---
 docs/config/index.md             | 2 +-
 packages/vite/src/node/config.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/config/index.md b/docs/config/index.md
index 43c616da0b7012..48e2ec69d0dea0 100644
--- a/docs/config/index.md
+++ b/docs/config/index.md
@@ -338,7 +338,7 @@ export default defineConfig(async ({ command, mode }) => {
 - **Type:** `string | string[]`
 - **Default:** `VITE_`
 
-  Env variables starts `envVariblePrefix` will be exposed to your client source code via import.meta.env.
+  Env variables starts with `envVariblePrefix` will be exposed to your client source code via import.meta.env.
 
 :::warning SECURITY NOTES
 
diff --git a/packages/vite/src/node/config.ts b/packages/vite/src/node/config.ts
index e5d1a30c0901df..2b67e79c8e28c6 100644
--- a/packages/vite/src/node/config.ts
+++ b/packages/vite/src/node/config.ts
@@ -172,7 +172,7 @@ export interface UserConfig {
    */
   envDir?: string
   /**
-   * Env variables starts `envVariblePrefix` will be exposed to your client source code via import.meta.env.
+   * Env variables starts with `envVariblePrefix` will be exposed to your client source code via import.meta.env.
    * @default 'VITE_'
    */
   envVariblePrefix?: string | string[]

From 31d93ccdf2ab292516e314dce8fd8b2e03b27db3 Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sun, 22 Aug 2021 13:35:16 +0800
Subject: [PATCH 09/10] wip: change option name to 'envPrefix'

---
 docs/config/index.md                          |  6 ++---
 docs/guide/env-and-mode.md                    |  2 +-
 packages/playground/env/vite.config.js        |  2 +-
 .../vite/src/node/__tests__/config.spec.ts    | 22 +++++++++----------
 packages/vite/src/node/config.ts              | 18 +++++++--------
 5 files changed, 25 insertions(+), 25 deletions(-)

diff --git a/docs/config/index.md b/docs/config/index.md
index 48e2ec69d0dea0..af39ab6dcb3826 100644
--- a/docs/config/index.md
+++ b/docs/config/index.md
@@ -333,16 +333,16 @@ export default defineConfig(async ({ command, mode }) => {
 
   See [here](/guide/env-and-mode#env-files) for more about environment files.
 
-### envVariblePrefix
+### envPrefix
 
 - **Type:** `string | string[]`
 - **Default:** `VITE_`
 
-  Env variables starts with `envVariblePrefix` will be exposed to your client source code via import.meta.env.
+  Env variables starts with `envPrefix` will be exposed to your client source code via import.meta.env.
 
 :::warning SECURITY NOTES
 
-- `envVariblePrefix` should not be set as `''`, which will expose all your env variables and cause unexpected leaking of of sensitive information. Vite will throw error when detecting `''`.
+- `envPrefix` should not be set as `''`, which will expose all your env variables and cause unexpected leaking of of sensitive information. Vite will throw error when detecting `''`.
   :::
 
 ## Server Options
diff --git a/docs/guide/env-and-mode.md b/docs/guide/env-and-mode.md
index 0dabd438d4cab8..92c326e413247e 100644
--- a/docs/guide/env-and-mode.md
+++ b/docs/guide/env-and-mode.md
@@ -44,7 +44,7 @@ VITE_SOME_KEY=123
 
 Only `VITE_SOME_KEY` will be exposed as `import.meta.env.VITE_SOME_KEY` to your client source code, but `DB_PASSWORD` will not.
 
-If you want to customize env variables prefix, see [envVariblePrefix](/config/index#envVariblePrefix) option.
+If you want to customize env variables prefix, see [envPrefix](/config/index#envPrefix) option.
 
 :::warning SECURITY NOTES
 
diff --git a/packages/playground/env/vite.config.js b/packages/playground/env/vite.config.js
index 38d065956aba33..9d6809cba8e39b 100644
--- a/packages/playground/env/vite.config.js
+++ b/packages/playground/env/vite.config.js
@@ -1,5 +1,5 @@
 const { defineConfig } = require('vite')
 
 module.exports = defineConfig({
-  envVariblePrefix: ['VITE_', 'CUSTOM_PREFIX_']
+  envPrefix: ['VITE_', 'CUSTOM_PREFIX_']
 })
diff --git a/packages/vite/src/node/__tests__/config.spec.ts b/packages/vite/src/node/__tests__/config.spec.ts
index b16818024e966a..9fa1a61b0b4710 100644
--- a/packages/vite/src/node/__tests__/config.spec.ts
+++ b/packages/vite/src/node/__tests__/config.spec.ts
@@ -3,7 +3,7 @@ import {
   mergeConfig,
   resolveConfig,
   UserConfigExport,
-  resolveEnvVariblePrefix,
+  resolveEnvPrefix,
   UserConfig
 } from '../config'
 
@@ -146,21 +146,21 @@ describe('resolveConfig', () => {
   })
 })
 
-describe('resolveEnvVariblePrefix', () => {
+describe('resolveEnvPrefix', () => {
   test(`use 'VITE_' as default value`, () => {
     const config: UserConfig = {}
-    expect(resolveEnvVariblePrefix(config)).toMatchObject(['VITE_'])
+    expect(resolveEnvPrefix(config)).toMatchObject(['VITE_'])
   })
 
-  test(`throw error if envVariblePrefix contains ''`, () => {
-    let config: UserConfig = { envVariblePrefix: '' }
-    expect(() => resolveEnvVariblePrefix(config)).toThrow()
-    config = { envVariblePrefix: ['', 'CUSTOM_'] }
-    expect(() => resolveEnvVariblePrefix(config)).toThrow()
+  test(`throw error if envPrefix contains ''`, () => {
+    let config: UserConfig = { envPrefix: '' }
+    expect(() => resolveEnvPrefix(config)).toThrow()
+    config = { envPrefix: ['', 'CUSTOM_'] }
+    expect(() => resolveEnvPrefix(config)).toThrow()
   })
 
-  test('should work correctly for valid envVariblePrefix value', () => {
-    const config: UserConfig = { envVariblePrefix: [' ', 'CUSTOM_'] }
-    expect(resolveEnvVariblePrefix(config)).toMatchObject([' ', 'CUSTOM_'])
+  test('should work correctly for valid envPrefix value', () => {
+    const config: UserConfig = { envPrefix: [' ', 'CUSTOM_'] }
+    expect(resolveEnvPrefix(config)).toMatchObject([' ', 'CUSTOM_'])
   })
 })
diff --git a/packages/vite/src/node/config.ts b/packages/vite/src/node/config.ts
index 2b67e79c8e28c6..3de1aa225ec1fd 100644
--- a/packages/vite/src/node/config.ts
+++ b/packages/vite/src/node/config.ts
@@ -172,10 +172,10 @@ export interface UserConfig {
    */
   envDir?: string
   /**
-   * Env variables starts with `envVariblePrefix` will be exposed to your client source code via import.meta.env.
+   * Env variables starts with `envPrefix` will be exposed to your client source code via import.meta.env.
    * @default 'VITE_'
    */
-  envVariblePrefix?: string | string[]
+  envPrefix?: string | string[]
   /**
    * Import aliases
    * @deprecated use `resolve.alias` instead
@@ -336,7 +336,7 @@ export async function resolveConfig(
     : resolvedRoot
   const userEnv =
     inlineConfig.envFile !== false &&
-    loadEnv(mode, envDir, resolveEnvVariblePrefix(config))
+    loadEnv(mode, envDir, resolveEnvPrefix(config))
 
   // Note it is possible for user to have a custom mode, e.g. `staging` where
   // production-like behavior is expected. This is indicated by NODE_ENV=production
@@ -1013,14 +1013,14 @@ export function loadEnv(
   return env
 }
 
-export function resolveEnvVariblePrefix({
-  envVariblePrefix = 'VITE_'
+export function resolveEnvPrefix({
+  envPrefix = 'VITE_'
 }: UserConfig): string[] {
-  envVariblePrefix = arraify(envVariblePrefix)
-  if (envVariblePrefix.some((prefix) => prefix === '')) {
+  envPrefix = arraify(envPrefix)
+  if (envPrefix.some((prefix) => prefix === '')) {
     throw new Error(
-      `envVariblePrefix option contains value '', which could lead unexpected exposure of sensitive information.`
+      `envPrefix option contains value '', which could lead unexpected exposure of sensitive information.`
     )
   }
-  return envVariblePrefix
+  return envPrefix
 }

From 831645c8dff24bb063384289c353c15fe4a6c5fd Mon Sep 17 00:00:00 2001
From: Yunfei He <i.heyunfei@gmail.com>
Date: Sun, 22 Aug 2021 14:40:03 +0800
Subject: [PATCH 10/10] wip: make loadEnv forward compatible

---
 packages/vite/src/node/config.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/vite/src/node/config.ts b/packages/vite/src/node/config.ts
index 3de1aa225ec1fd..3145b3db4227f8 100644
--- a/packages/vite/src/node/config.ts
+++ b/packages/vite/src/node/config.ts
@@ -955,7 +955,7 @@ async function loadConfigFromBundledFile(
 export function loadEnv(
   mode: string,
   envDir: string,
-  prefixes: string[]
+  prefixes: string | string[] = 'VITE_'
 ): Record<string, string> {
   if (mode === 'local') {
     throw new Error(
@@ -963,6 +963,7 @@ export function loadEnv(
         `the .local postfix for .env files.`
     )
   }
+  prefixes = arraify(prefixes)
   const env: Record<string, string> = {}
   const envFiles = [
     /** mode local file */ `.env.${mode}.local`,