From 29da61ccd4a1e7ff5edf9864791881604682f1bf Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Mon, 22 Aug 2022 23:28:32 -0500
Subject: [PATCH 01/40] fix(define): don't modify string literals

fix #9790
---
 packages/vite/src/node/plugins/define.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 0448327d660ed6..5b51bfd6d5dc28 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -1,4 +1,5 @@
 import MagicString from 'magic-string'
+import { stripLiteral } from 'strip-literal'
 import type { ResolvedConfig } from '../config'
 import type { Plugin } from '../plugin'
 import { transformStableResult } from '../utils'
@@ -134,6 +135,7 @@ export function definePlugin(config: ResolvedConfig): Plugin {
       let hasReplaced = false
       let match: RegExpExecArray | null
 
+      code = stripLiteral(code)
       while ((match = pattern.exec(code))) {
         hasReplaced = true
         const start = match.index

From 0781d42652a5ec514c24a1bfca7a68ab65e2048f Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Mon, 22 Aug 2022 23:30:08 -0500
Subject: [PATCH 02/40] test(define): verify define ignores literals

---
 .../src/node/__tests__/plugins/define.spec.ts  | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index 932560a749f24d..bc640877ece6e8 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -37,4 +37,22 @@ describe('definePlugin', () => {
       'const isSSR = false;'
     )
   })
+
+  test('ignores import\0.meta.env inside strings', async () => {
+    const transform = await createDefinePluginTransform({
+      'import\0.meta.env': '{}'
+    })
+    const inputs = [
+      `const isFoo = "import\0.meta.env.FOO";`,
+      `const isFoo = 'import\0.meta.env.FOO';`,
+      'const isFoo = `import\0.meta.env.FOO`;',
+      `const isFoo = \`
+"import.meta.env.FOO"
+\`;`
+    ]
+    for (const input of inputs) {
+      // transform() returns null when no replacement is made
+      expect(await transform(input)).toBe(null)
+    }
+  })
 })

From cf93c33b35143a2b324cf619419d13d7b8c46493 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Mon, 22 Aug 2022 23:55:28 -0500
Subject: [PATCH 03/40] test(define): expand tests out of loop to easily
 identify failures

---
 .../src/node/__tests__/plugins/define.spec.ts | 21 ++++++++-----------
 1 file changed, 9 insertions(+), 12 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index bc640877ece6e8..60ec949d9cdd5e 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -42,17 +42,14 @@ describe('definePlugin', () => {
     const transform = await createDefinePluginTransform({
       'import\0.meta.env': '{}'
     })
-    const inputs = [
-      `const isFoo = "import\0.meta.env.FOO";`,
-      `const isFoo = 'import\0.meta.env.FOO';`,
-      'const isFoo = `import\0.meta.env.FOO`;',
-      `const isFoo = \`
-"import.meta.env.FOO"
-\`;`
-    ]
-    for (const input of inputs) {
-      // transform() returns null when no replacement is made
-      expect(await transform(input)).toBe(null)
-    }
+    // transform() returns null when no replacement is made
+    expect(await transform(`const isFoo = "import\0.meta.env.FOO";`)).toBe(null)
+    expect(await transform(`const isFoo = 'import\0.meta.env.FOO';`)).toBe(null)
+    expect(await transform('const isFoo = `import\0.meta.env.FOO`;')).toBe(null)
+    expect(
+      await transform(`const isFoo = \`
+    "import\0.meta.env.FOO"
+    \`;`)
+    ).toBe(null)
   })
 })

From ed16db29c0bf8a258a6fd888ad2765d77b4ce6f4 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Mon, 22 Aug 2022 23:59:45 -0500
Subject: [PATCH 04/40] test(define): verify define ignores nested string of
 all quote types

---
 .../vite/src/node/__tests__/plugins/define.spec.ts     | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index 60ec949d9cdd5e..02ef83ece33268 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -51,5 +51,15 @@ describe('definePlugin', () => {
     "import\0.meta.env.FOO"
     \`;`)
     ).toBe(null)
+    expect(
+      await transform(`const isFoo = \`
+    'import\0.meta.env.FOO'
+    \`;`)
+    ).toBe(null)
+    expect(
+      await transform(`const isFoo = \`
+    \`import\0.meta.env.FOO\`
+    \`;`)
+    ).toBe(null)
   })
 })

From 589d30b7f2d1434d8c5dc2128497121ac5b7ba52 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 01:05:27 -0500
Subject: [PATCH 05/40] fix(define): don't modify string literals in ssr

---
 packages/vite/src/node/plugins/define.ts | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 5b51bfd6d5dc28..2ff76e0f839e0b 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -124,13 +124,6 @@ export function definePlugin(config: ResolvedConfig): Plugin {
         return null
       }
 
-      if (ssr && !isBuild) {
-        // ssr + dev, simple replace
-        return code.replace(pattern, (_, match) => {
-          return '' + replacements[match]
-        })
-      }
-
       const s = new MagicString(code)
       let hasReplaced = false
       let match: RegExpExecArray | null

From 603073c21e9d9e6c9944807d1dbbbeb3cf596b83 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 01:06:16 -0500
Subject: [PATCH 06/40] test(define): verify define ignores literals in ssr
 mode

---
 .../src/node/__tests__/plugins/define.spec.ts | 31 ++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index 02ef83ece33268..8f180d329964ac 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -38,7 +38,7 @@ describe('definePlugin', () => {
     )
   })
 
-  test('ignores import\0.meta.env inside strings', async () => {
+  test('ignores import\0.meta.env inside strings for non-SSR', async () => {
     const transform = await createDefinePluginTransform({
       'import\0.meta.env': '{}'
     })
@@ -62,4 +62,33 @@ describe('definePlugin', () => {
     \`;`)
     ).toBe(null)
   })
+
+  test('ignores import\0.meta.env inside strings for SSR', async () => {
+    const transform = await createDefinePluginTransform(
+      {
+        'import\0.meta.env': '{}'
+      },
+      true,
+      true
+    )
+    // transform() returns null when no replacement is made
+    expect(await transform(`const isFoo = "import\0.meta.env.FOO";`)).toBe(null)
+    expect(await transform(`const isFoo = 'import\0.meta.env.FOO';`)).toBe(null)
+    expect(await transform('const isFoo = `import\0.meta.env.FOO`;')).toBe(null)
+    expect(
+      await transform(`const isFoo = \`
+    "import\0.meta.env.FOO"
+    \`;`)
+    ).toBe(null)
+    expect(
+      await transform(`const isFoo = \`
+    'import\0.meta.env.FOO'
+    \`;`)
+    ).toBe(null)
+    expect(
+      await transform(`const isFoo = \`
+    \`import\0.meta.env.FOO\`
+    \`;`)
+    ).toBe(null)
+  })
 })

From 2eb1aea1f67d6cc44abdf00b6cad3d8f2e6f934b Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 15:43:09 -0500
Subject: [PATCH 07/40] test(define): include tests from #9621

---
 playground/react/App.jsx                       | 2 ++
 playground/react/__tests__/react.spec.ts       | 7 +++++++
 playground/react/components/DefineVariable.tsx | 3 +++
 playground/vue/DefineVariable.vue              | 3 +++
 playground/vue/Main.vue                        | 2 ++
 playground/vue/__tests__/vue.spec.ts           | 9 +++++++++
 6 files changed, 26 insertions(+)
 create mode 100644 playground/react/components/DefineVariable.tsx
 create mode 100644 playground/vue/DefineVariable.vue

diff --git a/playground/react/App.jsx b/playground/react/App.jsx
index 3ec29ba38d893b..531ee7e959f114 100644
--- a/playground/react/App.jsx
+++ b/playground/react/App.jsx
@@ -1,5 +1,6 @@
 import { useState } from 'react'
 import Dummy from './components/Dummy?qs-should-not-break-plugin-react'
+import DefineVariable from './components/DefineVariable'
 import Button from 'jsx-entry'
 
 function App() {
@@ -27,6 +28,7 @@ function App() {
       </header>
 
       <Dummy />
+      <DefineVariable />
       <Button>button</Button>
     </div>
   )
diff --git a/playground/react/__tests__/react.spec.ts b/playground/react/__tests__/react.spec.ts
index 15f6319220d7f2..1b3700dd0bdcfb 100644
--- a/playground/react/__tests__/react.spec.ts
+++ b/playground/react/__tests__/react.spec.ts
@@ -37,3 +37,10 @@ test.runIf(isServe)(
     ])
   }
 )
+
+test('defined/reserved words are preserved in string literals', async () => {
+  expect(await page.textContent('.define-variable')).toBe(
+    // FIXME: insert \0 to prevent Vite from replacing import.meta.env
+    'import\0.meta.env'.replace('\0', '')
+  )
+})
diff --git a/playground/react/components/DefineVariable.tsx b/playground/react/components/DefineVariable.tsx
new file mode 100644
index 00000000000000..465baf04d0adbb
--- /dev/null
+++ b/playground/react/components/DefineVariable.tsx
@@ -0,0 +1,3 @@
+export default function DefineVariable() {
+  return <div class="define-variable">import.meta.env</div>
+}
diff --git a/playground/vue/DefineVariable.vue b/playground/vue/DefineVariable.vue
new file mode 100644
index 00000000000000..aa57b934362bc5
--- /dev/null
+++ b/playground/vue/DefineVariable.vue
@@ -0,0 +1,3 @@
+<template>
+  <div class="define-variable">import.meta.env</div>
+</template>
diff --git a/playground/vue/Main.vue b/playground/vue/Main.vue
index c5f3d27402fda7..6e7cc2017875a4 100644
--- a/playground/vue/Main.vue
+++ b/playground/vue/Main.vue
@@ -22,6 +22,7 @@
   <ReactivityTransform :foo="time" />
   <SetupImportTemplate />
   <WorkerTest />
+  <DefineVariable />
 </template>
 
 <script setup lang="ts">
@@ -39,6 +40,7 @@ import AsyncComponent from './AsyncComponent.vue'
 import ReactivityTransform from './ReactivityTransform.vue'
 import SetupImportTemplate from './setup-import-template/SetupImportTemplate.vue'
 import WorkerTest from './worker.vue'
+import DefineVariable from './DefineVariable.vue'
 import { ref } from 'vue'
 
 const time = ref('loading...')
diff --git a/playground/vue/__tests__/vue.spec.ts b/playground/vue/__tests__/vue.spec.ts
index 51dbf82a480aff..25a936dfaa4970 100644
--- a/playground/vue/__tests__/vue.spec.ts
+++ b/playground/vue/__tests__/vue.spec.ts
@@ -263,3 +263,12 @@ describe('vue worker', () => {
     expect(await page.textContent('.vue-worker')).toMatch('worker load!')
   })
 })
+
+describe('defined/reserved words', () => {
+  test('are preserved in string literals', async () => {
+    expect(await page.textContent('.define-variable')).toBe(
+      // FIXME: insert \0 to prevent Vite from replacing import.meta.env
+      'import\0.meta.env'.replace('\0', '')
+    )
+  })
+})

From 91c47d4468cc99029395a6f3b7fdf043bdfb1d95 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 16:22:12 -0500
Subject: [PATCH 08/40] fix(define): only strip literals if special constant
 found

---
 packages/vite/src/node/plugins/define.ts | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 2ff76e0f839e0b..cca9a74eb46395 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -124,11 +124,23 @@ export function definePlugin(config: ResolvedConfig): Plugin {
         return null
       }
 
+      const maybeNeedsReplacement = new RegExp(pattern).test(code)
+
+      if (ssr && !isBuild && !maybeNeedsReplacement) {
+        // ssr + dev, simple replace
+        return code.replace(pattern, (_, match) => {
+          return '' + replacements[match]
+        })
+      }
+
       const s = new MagicString(code)
       let hasReplaced = false
       let match: RegExpExecArray | null
 
-      code = stripLiteral(code)
+      if (maybeNeedsReplacement) {
+        code = stripLiteral(code)
+      }
+
       while ((match = pattern.exec(code))) {
         hasReplaced = true
         const start = match.index

From 2031d94517c83b81025ad6134fd234aed2175600 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 18:47:03 -0500
Subject: [PATCH 09/40] fix(define): remove unnecessary string replace for ssr

---
 packages/vite/src/node/plugins/define.ts | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index cca9a74eb46395..2fdecd4551337e 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -128,9 +128,7 @@ export function definePlugin(config: ResolvedConfig): Plugin {
 
       if (ssr && !isBuild && !maybeNeedsReplacement) {
         // ssr + dev, simple replace
-        return code.replace(pattern, (_, match) => {
-          return '' + replacements[match]
-        })
+        return code
       }
 
       const s = new MagicString(code)

From 8974e6588d1e4ac7385a5610684409c0d34eb4eb Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 18:49:25 -0500
Subject: [PATCH 10/40] fix(define): only start matching if replacement needed

---
 packages/vite/src/node/plugins/define.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 2fdecd4551337e..0575e9a1c37c7e 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -137,14 +137,14 @@ export function definePlugin(config: ResolvedConfig): Plugin {
 
       if (maybeNeedsReplacement) {
         code = stripLiteral(code)
-      }
 
-      while ((match = pattern.exec(code))) {
-        hasReplaced = true
-        const start = match.index
-        const end = start + match[0].length
-        const replacement = '' + replacements[match[1]]
-        s.overwrite(start, end, replacement, { contentOnly: true })
+        while ((match = pattern.exec(code))) {
+          hasReplaced = true
+          const start = match.index
+          const end = start + match[0].length
+          const replacement = '' + replacements[match[1]]
+          s.overwrite(start, end, replacement, { contentOnly: true })
+        }
       }
 
       if (!hasReplaced) {

From 46153b7153232b8dcd8a81418bb6efc0d4424a3c Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 19:04:51 -0500
Subject: [PATCH 11/40] fix(define): return null early if no replacements
 needed

---
 packages/vite/src/node/plugins/define.ts | 22 +++++++++-------------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 0575e9a1c37c7e..3ffa3282ef45f1 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -125,26 +125,22 @@ export function definePlugin(config: ResolvedConfig): Plugin {
       }
 
       const maybeNeedsReplacement = new RegExp(pattern).test(code)
-
-      if (ssr && !isBuild && !maybeNeedsReplacement) {
-        // ssr + dev, simple replace
-        return code
+      if (!maybeNeedsReplacement) {
+        return null
       }
 
       const s = new MagicString(code)
       let hasReplaced = false
       let match: RegExpExecArray | null
 
-      if (maybeNeedsReplacement) {
-        code = stripLiteral(code)
+      code = stripLiteral(code)
 
-        while ((match = pattern.exec(code))) {
-          hasReplaced = true
-          const start = match.index
-          const end = start + match[0].length
-          const replacement = '' + replacements[match[1]]
-          s.overwrite(start, end, replacement, { contentOnly: true })
-        }
+      while ((match = pattern.exec(code))) {
+        hasReplaced = true
+        const start = match.index
+        const end = start + match[0].length
+        const replacement = '' + replacements[match[1]]
+        s.overwrite(start, end, replacement, { contentOnly: true })
       }
 
       if (!hasReplaced) {

From 609df101d89afa1bbc38412b40ccb3b1b41120ba Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 22:22:25 -0500
Subject: [PATCH 12/40] wip: test(define): more tests

---
 .../src/node/__tests__/plugins/define.spec.ts | 158 ++++++++++++------
 1 file changed, 109 insertions(+), 49 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index 8f180d329964ac..f0624eca11c817 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -38,57 +38,117 @@ describe('definePlugin', () => {
     )
   })
 
-  test('ignores import\0.meta.env inside strings for non-SSR', async () => {
-    const transform = await createDefinePluginTransform({
-      'import\0.meta.env': '{}'
+  // Specially defined constants found in packages/vite/src/node/plugins/define.ts
+  const specialDefines = {
+    'process.env.': '({}).',
+    'global.process.env.': '({}).',
+    'globalThis.process.env.': '({}).',
+    'process.env.NODE_ENV': '"test"',
+    'global.process.env.NODE_ENV': '"test"',
+    'globalThis.process.env.NODE_ENV': '"test"',
+    __vite_process_env_NODE_ENV: '"test"',
+    // FIXME: Insert \0 to prevent Vite from replacing special constants in string literals
+    ['import\0.meta.env.'.replace(/\0/g, '')]: '({}).',
+    ['import\0.meta.env'.replace(/\0/g, '')]: '({})',
+    'import.meta.hot': 'false'
+  }
+  const specialDefineKeys = Object.keys(specialDefines)
+
+  const specialDefinesSSR = {
+    'process.env.': null,
+    'global.process.env.': null,
+    'globalThis.process.env.': null,
+    'process.env.NODE_ENV': null,
+    'global.process.env.NODE_ENV': null,
+    'globalThis.process.env.NODE_ENV': null,
+    __vite_process_env_NODE_ENV: 'process.env.NODE_ENV',
+    // FIXME: Insert \0 to prevent Vite from replacing special constants in string literals
+    ['import\0.meta.env.'.replace(/\0/g, '')]: '({}).',
+    ['import\0.meta.env'.replace(/\0/g, '')]: '({})',
+    'import.meta.hot': 'false'
+  }
+  const specialDefineKeysSSR = Object.keys(specialDefinesSSR)
+
+  describe('ignores specially defined constants in string literals', async () => {
+    const singleQuotedDefines = specialDefineKeys
+      .map((define) => `let x = '${define}'`)
+      .join(';\n')
+    const doubleQuotedDefines = specialDefineKeys
+      .map((define) => `let x = "${define}"`)
+      .join(';\n')
+    const backtickedDefines = specialDefineKeys
+      .map((define) => `let x = \`${define}\``)
+      .join(';\n')
+    const singleQuotedDefinesMultilineNested = specialDefineKeys
+      .map((define) => `let x = \n'${define}'\n\``)
+      .join(';\n')
+    const doubleQuotedDefinesMultilineNested = specialDefineKeys
+      .map((define) => `let x = \n"${define}"\n\``)
+      .join(';\n')
+    const backtickedDefinesMultilineNested = specialDefineKeys
+      .map((define) => `let x = \`\n${define}\n\``)
+      .join(';\n')
+
+    const inputs = [
+      ['double-quoted', doubleQuotedDefines],
+      ['single-quoted', singleQuotedDefines],
+      ['backticked', backtickedDefines],
+      ['multiline nested double-quoted', doubleQuotedDefinesMultilineNested],
+      ['multiline nested single-quoted', singleQuotedDefinesMultilineNested],
+      ['multiline nested backticked', backtickedDefinesMultilineNested]
+    ]
+
+    describe('non-SSR', async () => {
+      const transform = await createDefinePluginTransform()
+      test.each(inputs)('in %s', async (label, input) => {
+        // transform() returns null when no replacement is made
+        expect(await transform(input)).toBe(null)
+      })
+    })
+    describe('SSR', async () => {
+      const transform = await createDefinePluginTransform({}, true, true)
+      test.each(inputs)('in %s', async (label, input) => {
+        // transform() returns null when no replacement is made
+        expect(await transform(input)).toBe(null)
+      })
     })
-    // transform() returns null when no replacement is made
-    expect(await transform(`const isFoo = "import\0.meta.env.FOO";`)).toBe(null)
-    expect(await transform(`const isFoo = 'import\0.meta.env.FOO';`)).toBe(null)
-    expect(await transform('const isFoo = `import\0.meta.env.FOO`;')).toBe(null)
-    expect(
-      await transform(`const isFoo = \`
-    "import\0.meta.env.FOO"
-    \`;`)
-    ).toBe(null)
-    expect(
-      await transform(`const isFoo = \`
-    'import\0.meta.env.FOO'
-    \`;`)
-    ).toBe(null)
-    expect(
-      await transform(`const isFoo = \`
-    \`import\0.meta.env.FOO\`
-    \`;`)
-    ).toBe(null)
   })
 
-  test('ignores import\0.meta.env inside strings for SSR', async () => {
-    const transform = await createDefinePluginTransform(
-      {
-        'import\0.meta.env': '{}'
-      },
-      true,
-      true
-    )
-    // transform() returns null when no replacement is made
-    expect(await transform(`const isFoo = "import\0.meta.env.FOO";`)).toBe(null)
-    expect(await transform(`const isFoo = 'import\0.meta.env.FOO';`)).toBe(null)
-    expect(await transform('const isFoo = `import\0.meta.env.FOO`;')).toBe(null)
-    expect(
-      await transform(`const isFoo = \`
-    "import\0.meta.env.FOO"
-    \`;`)
-    ).toBe(null)
-    expect(
-      await transform(`const isFoo = \`
-    'import\0.meta.env.FOO'
-    \`;`)
-    ).toBe(null)
-    expect(
-      await transform(`const isFoo = \`
-    \`import\0.meta.env.FOO\`
-    \`;`)
-    ).toBe(null)
+  // FIXME: Some of these tests are failing. I'm in the middle of figuring out why.
+  describe('replaces defined constants in template literal expressions', async () => {
+    describe('non-SSR', async () => {
+      const transform = await createDefinePluginTransform()
+      test.each(specialDefineKeys)('%s', async (key) => {
+        expect(await transform('let x = `${' + key + '}`')).toBe(
+          'let x = `${' + specialDefines[key] + '}`'
+        )
+      })
+      test.each(specialDefineKeys)('%s', async (key) => {
+        expect(await transform('let x = `\n${' + key + '}\n`')).toBe(
+          'let x = `\n${' + specialDefines[key] + '}\n`'
+        )
+      })
+    })
+    describe('SSR', async () => {
+      const transform = await createDefinePluginTransform({}, true, true)
+      test.each(specialDefineKeysSSR)('%s', async (key) => {
+        if (specialDefinesSSR[key]) {
+          expect(await transform('let x = `${' + key + '}`')).toBe(
+            'let x = `${' + specialDefinesSSR[key] + '}`'
+          )
+        } else {
+          expect(await transform('let x = `${' + key + '}`')).toBe(null)
+        }
+      })
+      test.each(specialDefineKeysSSR)('%s', async (key) => {
+        if (specialDefinesSSR[key]) {
+          expect(await transform('let x = `\n${' + key + '}\n`')).toBe(
+            'let x = `\n${' + specialDefinesSSR[key] + '}\n`'
+          )
+        } else {
+          expect(await transform('let x = `\n${' + key + '}\n`')).toBe(null)
+        }
+      })
+    })
   })
 })

From f5277f0f359340253c98e073816961d6b4989aea Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 22:50:07 -0500
Subject: [PATCH 13/40] wip: test(define): skip meta.env and process.env tests
 for now

The failures are unrelated to my changes, as they still occur with
my changes removed. I just need to figure out the correct way to test
these inputs.
---
 .../src/node/__tests__/plugins/define.spec.ts | 20 ++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index f0624eca11c817..042bc493bdea6b 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -114,24 +114,34 @@ describe('definePlugin', () => {
     })
   })
 
-  // FIXME: Some of these tests are failing. I'm in the middle of figuring out why.
   describe('replaces defined constants in template literal expressions', async () => {
     describe('non-SSR', async () => {
       const transform = await createDefinePluginTransform()
-      test.each(specialDefineKeys)('%s', async (key) => {
+
+      // FIXME: These tests are failing for some reason. I'm in the middle of figuring out why.
+      const focusedSpecialDefineKeys = specialDefineKeys.filter(
+        (key) => !key.includes('meta.env') && !key.startsWith('process.env')
+      )
+
+      test.each(focusedSpecialDefineKeys)('%s', async (key) => {
         expect(await transform('let x = `${' + key + '}`')).toBe(
           'let x = `${' + specialDefines[key] + '}`'
         )
       })
-      test.each(specialDefineKeys)('%s', async (key) => {
+      test.each(focusedSpecialDefineKeys)('%s', async (key) => {
         expect(await transform('let x = `\n${' + key + '}\n`')).toBe(
           'let x = `\n${' + specialDefines[key] + '}\n`'
         )
       })
     })
     describe('SSR', async () => {
+      // FIXME: These tests are failing for some reason. I'm in the middle of figuring out why.
+      const focusedSpecialDefineKeys = specialDefineKeysSSR.filter(
+        (key) => !key.includes('meta.env') && !key.startsWith('process.env')
+      )
+
       const transform = await createDefinePluginTransform({}, true, true)
-      test.each(specialDefineKeysSSR)('%s', async (key) => {
+      test.each(focusedSpecialDefineKeys)('%s', async (key) => {
         if (specialDefinesSSR[key]) {
           expect(await transform('let x = `${' + key + '}`')).toBe(
             'let x = `${' + specialDefinesSSR[key] + '}`'
@@ -140,7 +150,7 @@ describe('definePlugin', () => {
           expect(await transform('let x = `${' + key + '}`')).toBe(null)
         }
       })
-      test.each(specialDefineKeysSSR)('%s', async (key) => {
+      test.each(focusedSpecialDefineKeys)('%s', async (key) => {
         if (specialDefinesSSR[key]) {
           expect(await transform('let x = `\n${' + key + '}\n`')).toBe(
             'let x = `\n${' + specialDefinesSSR[key] + '}\n`'

From 6a06d5f86f17d65c0f3491a15fa1767213352436 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 23:01:43 -0500
Subject: [PATCH 14/40] wip: test(define): refactor

---
 .../src/node/__tests__/plugins/define.spec.ts | 48 +++++++++----------
 1 file changed, 22 insertions(+), 26 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index 042bc493bdea6b..cefbc6561fece2 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -119,45 +119,41 @@ describe('definePlugin', () => {
       const transform = await createDefinePluginTransform()
 
       // FIXME: These tests are failing for some reason. I'm in the middle of figuring out why.
-      const focusedSpecialDefineKeys = specialDefineKeys.filter(
+      const keysToTest = specialDefineKeys.filter(
         (key) => !key.includes('meta.env') && !key.startsWith('process.env')
       )
 
-      test.each(focusedSpecialDefineKeys)('%s', async (key) => {
-        expect(await transform('let x = `${' + key + '}`')).toBe(
-          'let x = `${' + specialDefines[key] + '}`'
-        )
+      test.each(keysToTest)('%s', async (key) => {
+        const result = await transform('let x = `${' + key + '}`')
+        expect(result).toBe('let x = `${' + specialDefines[key] + '}`')
       })
-      test.each(focusedSpecialDefineKeys)('%s', async (key) => {
-        expect(await transform('let x = `\n${' + key + '}\n`')).toBe(
-          'let x = `\n${' + specialDefines[key] + '}\n`'
-        )
+      test.each(keysToTest)('%s', async (key) => {
+        const result = await transform('let x = `\n${' + key + '}\n`')
+        expect(result).toBe('let x = `\n${' + specialDefines[key] + '}\n`')
       })
     })
     describe('SSR', async () => {
       // FIXME: These tests are failing for some reason. I'm in the middle of figuring out why.
-      const focusedSpecialDefineKeys = specialDefineKeysSSR.filter(
+      const keysToTest = specialDefineKeysSSR.filter(
         (key) => !key.includes('meta.env') && !key.startsWith('process.env')
       )
 
       const transform = await createDefinePluginTransform({}, true, true)
-      test.each(focusedSpecialDefineKeys)('%s', async (key) => {
-        if (specialDefinesSSR[key]) {
-          expect(await transform('let x = `${' + key + '}`')).toBe(
-            'let x = `${' + specialDefinesSSR[key] + '}`'
-          )
-        } else {
-          expect(await transform('let x = `${' + key + '}`')).toBe(null)
-        }
+      test.each(keysToTest)('%s', async (key) => {
+        const result = await transform('let x = `${' + key + '}`')
+        expect(result).toBe(
+          specialDefinesSSR[key]
+            ? 'let x = `${' + specialDefinesSSR[key] + '}`'
+            : null
+        )
       })
-      test.each(focusedSpecialDefineKeys)('%s', async (key) => {
-        if (specialDefinesSSR[key]) {
-          expect(await transform('let x = `\n${' + key + '}\n`')).toBe(
-            'let x = `\n${' + specialDefinesSSR[key] + '}\n`'
-          )
-        } else {
-          expect(await transform('let x = `\n${' + key + '}\n`')).toBe(null)
-        }
+      test.each(keysToTest)('%s', async (key) => {
+        const result = await transform('let x = `\n${' + key + '}\n`')
+        expect(result).toBe(
+          specialDefinesSSR[key]
+            ? 'let x = `\n${' + specialDefinesSSR[key] + '}\n`'
+            : null
+        )
       })
     })
   })

From d83ab8245689830cf31bec59029c619f4a8c157b Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 23:38:53 -0500
Subject: [PATCH 15/40] wip: test(define): fix tests for for import.meta.env

---
 .../src/node/__tests__/plugins/define.spec.ts | 45 ++++++++-----------
 1 file changed, 19 insertions(+), 26 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index cefbc6561fece2..d39d494118a233 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -15,6 +15,9 @@ async function createDefinePluginTransform(
   }
 }
 
+// FIXME: Insert \0 to prevent Vite from replacing special constants in string literals
+const importMetaEnv = 'import\0.meta.env'.replace(/\0/g, '')
+
 describe('definePlugin', () => {
   test('replaces custom define', async () => {
     const transform = await createDefinePluginTransform({
@@ -28,12 +31,12 @@ describe('definePlugin', () => {
     )
   })
 
-  test('replaces import.meta.env.SSR with false', async () => {
+  test(`replaces ${importMetaEnv}.SSR with false`, async () => {
     const transform = await createDefinePluginTransform()
-    expect(await transform('const isSSR = import.meta.env.SSR ;')).toBe(
+    expect(await transform(`const isSSR = ${importMetaEnv}.SSR ;`)).toBe(
       'const isSSR = false ;'
     )
-    expect(await transform('const isSSR = import.meta.env.SSR;')).toBe(
+    expect(await transform(`const isSSR = ${importMetaEnv}.SSR;`)).toBe(
       'const isSSR = false;'
     )
   })
@@ -47,9 +50,9 @@ describe('definePlugin', () => {
     'global.process.env.NODE_ENV': '"test"',
     'globalThis.process.env.NODE_ENV': '"test"',
     __vite_process_env_NODE_ENV: '"test"',
-    // FIXME: Insert \0 to prevent Vite from replacing special constants in string literals
-    ['import\0.meta.env.'.replace(/\0/g, '')]: '({}).',
-    ['import\0.meta.env'.replace(/\0/g, '')]: '({})',
+    [importMetaEnv + '.']: '({}).',
+    [importMetaEnv]:
+      '{"BASE_URL":"/","MODE":"development","DEV":true,"PROD":false}',
     'import.meta.hot': 'false'
   }
   const specialDefineKeys = Object.keys(specialDefines)
@@ -62,9 +65,9 @@ describe('definePlugin', () => {
     'global.process.env.NODE_ENV': null,
     'globalThis.process.env.NODE_ENV': null,
     __vite_process_env_NODE_ENV: 'process.env.NODE_ENV',
-    // FIXME: Insert \0 to prevent Vite from replacing special constants in string literals
-    ['import\0.meta.env.'.replace(/\0/g, '')]: '({}).',
-    ['import\0.meta.env'.replace(/\0/g, '')]: '({})',
+    [importMetaEnv + '.']: '({}).',
+    [importMetaEnv]:
+      '{"BASE_URL":"/","MODE":"development","DEV":true,"PROD":false}',
     'import.meta.hot': 'false'
   }
   const specialDefineKeysSSR = Object.keys(specialDefinesSSR)
@@ -118,37 +121,27 @@ describe('definePlugin', () => {
     describe('non-SSR', async () => {
       const transform = await createDefinePluginTransform()
 
-      // FIXME: These tests are failing for some reason. I'm in the middle of figuring out why.
-      const keysToTest = specialDefineKeys.filter(
-        (key) => !key.includes('meta.env') && !key.startsWith('process.env')
-      )
-
-      test.each(keysToTest)('%s', async (key) => {
+      test.each(specialDefineKeys)('%s', async (key) => {
         const result = await transform('let x = `${' + key + '}`')
         expect(result).toBe('let x = `${' + specialDefines[key] + '}`')
       })
-      test.each(keysToTest)('%s', async (key) => {
+      test.each(specialDefineKeys)('%s', async (key) => {
         const result = await transform('let x = `\n${' + key + '}\n`')
         expect(result).toBe('let x = `\n${' + specialDefines[key] + '}\n`')
       })
     })
     describe('SSR', async () => {
-      // FIXME: These tests are failing for some reason. I'm in the middle of figuring out why.
-      const keysToTest = specialDefineKeysSSR.filter(
-        (key) => !key.includes('meta.env') && !key.startsWith('process.env')
-      )
-
-      const transform = await createDefinePluginTransform({}, true, true)
-      test.each(keysToTest)('%s', async (key) => {
-        const result = await transform('let x = `${' + key + '}`')
+      const ssrTransform = await createDefinePluginTransform({}, true, true)
+      test.each(specialDefineKeysSSR)('%s', async (key) => {
+        const result = await ssrTransform('let x = `${' + key + '}`')
         expect(result).toBe(
           specialDefinesSSR[key]
             ? 'let x = `${' + specialDefinesSSR[key] + '}`'
             : null
         )
       })
-      test.each(keysToTest)('%s', async (key) => {
-        const result = await transform('let x = `\n${' + key + '}\n`')
+      test.each(specialDefineKeysSSR)('%s', async (key) => {
+        const result = await ssrTransform('let x = `\n${' + key + '}\n`')
         expect(result).toBe(
           specialDefinesSSR[key]
             ? 'let x = `\n${' + specialDefinesSSR[key] + '}\n`'

From 73192755b1fdbf29c15aa498f1a4c5dc07f61103 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 23:40:03 -0500
Subject: [PATCH 16/40] fix(define): prevent replacement of import.meta.env
 during tests

---
 packages/vite/src/node/plugins/define.ts | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 3ffa3282ef45f1..3cf4cb2891fcdf 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -46,12 +46,13 @@ export function definePlugin(config: ResolvedConfig): Plugin {
       ...config.env,
       SSR: !!config.build.ssr
     }
+    const importMetaEnv = 'import\0.meta.env'.replace(/\0/g, '')
     for (const key in env) {
-      importMetaKeys[`import.meta.env.${key}`] = JSON.stringify(env[key])
+      importMetaKeys[`${importMetaEnv}.${key}`] = JSON.stringify(env[key])
     }
     Object.assign(importMetaFallbackKeys, {
-      'import.meta.env.': `({}).`,
-      'import.meta.env': JSON.stringify(config.env),
+      [importMetaEnv + '.']: `({}).`,
+      [importMetaEnv]: JSON.stringify(config.env),
       'import.meta.hot': `false`
     })
   }

From d87549520d90c6d94ca380ab41a56d04d73efc28 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 23:41:10 -0500
Subject: [PATCH 17/40] test(define): fix possibly-undefined warning

---
 packages/vite/src/node/__tests__/plugins/define.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index d39d494118a233..c310211f47c889 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -10,7 +10,7 @@ async function createDefinePluginTransform(
   const config = await resolveConfig({ define }, build ? 'build' : 'serve')
   const instance = definePlugin(config)
   return async (code: string) => {
-    const result = await instance.transform.call({}, code, 'foo.ts', { ssr })
+    const result = await instance.transform?.call({}, code, 'foo.ts', { ssr })
     return result?.code || result
   }
 }

From 89d8c29134930504c3c781d8adac55dceb437c4b Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 23 Aug 2022 23:52:37 -0500
Subject: [PATCH 18/40] test(define): tweaks

---
 .../src/node/__tests__/plugins/define.spec.ts | 30 +++++++++++--------
 1 file changed, 17 insertions(+), 13 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index c310211f47c889..08e8a54c94214d 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -58,21 +58,19 @@ describe('definePlugin', () => {
   const specialDefineKeys = Object.keys(specialDefines)
 
   const specialDefinesSSR = {
+    ...specialDefines,
+    // process.env is not replaced in SSR
     'process.env.': null,
     'global.process.env.': null,
     'globalThis.process.env.': null,
     'process.env.NODE_ENV': null,
     'global.process.env.NODE_ENV': null,
     'globalThis.process.env.NODE_ENV': null,
-    __vite_process_env_NODE_ENV: 'process.env.NODE_ENV',
-    [importMetaEnv + '.']: '({}).',
-    [importMetaEnv]:
-      '{"BASE_URL":"/","MODE":"development","DEV":true,"PROD":false}',
-    'import.meta.hot': 'false'
+    // __vite_process_env_NODE_ENV is a special variable to resolves to process.env.NODE_ENV, which is not replaced in SSR
+    __vite_process_env_NODE_ENV: 'process.env.NODE_ENV'
   }
-  const specialDefineKeysSSR = Object.keys(specialDefinesSSR)
 
-  describe('ignores specially defined constants in string literals', async () => {
+  describe('ignores defined constants in string literals', async () => {
     const singleQuotedDefines = specialDefineKeys
       .map((define) => `let x = '${define}'`)
       .join(';\n')
@@ -103,16 +101,17 @@ describe('definePlugin', () => {
 
     describe('non-SSR', async () => {
       const transform = await createDefinePluginTransform()
-      test.each(inputs)('in %s', async (label, input) => {
+      test.each(inputs)('%s', async (label, input) => {
         // transform() returns null when no replacement is made
         expect(await transform(input)).toBe(null)
       })
     })
+
     describe('SSR', async () => {
-      const transform = await createDefinePluginTransform({}, true, true)
-      test.each(inputs)('in %s', async (label, input) => {
+      const ssrTransform = await createDefinePluginTransform({}, true, true)
+      test.each(inputs)('%s', async (label, input) => {
         // transform() returns null when no replacement is made
-        expect(await transform(input)).toBe(null)
+        expect(await ssrTransform(input)).toBe(null)
       })
     })
   })
@@ -125,6 +124,8 @@ describe('definePlugin', () => {
         const result = await transform('let x = `${' + key + '}`')
         expect(result).toBe('let x = `${' + specialDefines[key] + '}`')
       })
+
+      // multiline tests
       test.each(specialDefineKeys)('%s', async (key) => {
         const result = await transform('let x = `\n${' + key + '}\n`')
         expect(result).toBe('let x = `\n${' + specialDefines[key] + '}\n`')
@@ -132,7 +133,8 @@ describe('definePlugin', () => {
     })
     describe('SSR', async () => {
       const ssrTransform = await createDefinePluginTransform({}, true, true)
-      test.each(specialDefineKeysSSR)('%s', async (key) => {
+
+      test.each(specialDefineKeys)('%s', async (key) => {
         const result = await ssrTransform('let x = `${' + key + '}`')
         expect(result).toBe(
           specialDefinesSSR[key]
@@ -140,7 +142,9 @@ describe('definePlugin', () => {
             : null
         )
       })
-      test.each(specialDefineKeysSSR)('%s', async (key) => {
+
+      // multiline tests
+      test.each(specialDefineKeys)('%s', async (key) => {
         const result = await ssrTransform('let x = `\n${' + key + '}\n`')
         expect(result).toBe(
           specialDefinesSSR[key]

From 188fbdde8d9bb9c9d2697992bab6932ca2b14c29 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Wed, 24 Aug 2022 00:31:58 -0500
Subject: [PATCH 19/40] chore: escape import.meta.env in vue playground

---
 playground/vue/__tests__/vue.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/playground/vue/__tests__/vue.spec.ts b/playground/vue/__tests__/vue.spec.ts
index 25a936dfaa4970..b8e81d19aceb4d 100644
--- a/playground/vue/__tests__/vue.spec.ts
+++ b/playground/vue/__tests__/vue.spec.ts
@@ -267,7 +267,7 @@ describe('vue worker', () => {
 describe('defined/reserved words', () => {
   test('are preserved in string literals', async () => {
     expect(await page.textContent('.define-variable')).toBe(
-      // FIXME: insert \0 to prevent Vite from replacing import.meta.env
+      // FIXME: insert \0 to prevent Vite from replacing import\0.meta.env
       'import\0.meta.env'.replace('\0', '')
     )
   })

From e71a22c7ef55a6ff436ec80bd4ff431804a79cef Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Wed, 24 Aug 2022 16:52:56 -0500
Subject: [PATCH 20/40] fix(define): use object hook

---
 packages/vite/src/node/__tests__/plugins/define.spec.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index 08e8a54c94214d..42a5238558a165 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -10,7 +10,11 @@ async function createDefinePluginTransform(
   const config = await resolveConfig({ define }, build ? 'build' : 'serve')
   const instance = definePlugin(config)
   return async (code: string) => {
-    const result = await instance.transform?.call({}, code, 'foo.ts', { ssr })
+    const transform =
+      instance.transform && 'handler' in instance.transform
+        ? instance.transform.handler
+        : instance.transform
+    const result = await transform?.call({}, code, 'foo.ts', { ssr })
     return result?.code || result
   }
 }

From 22a9010dda7b5c6313bd26e8347a5e52690761a1 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Wed, 24 Aug 2022 16:57:07 -0500
Subject: [PATCH 21/40] fix(define): simplify workaround for import.meta.env
 replacement

---
 packages/vite/src/node/__tests__/plugins/define.spec.ts | 4 ++--
 packages/vite/src/node/plugins/define.ts                | 5 ++++-
 playground/react/__tests__/react.spec.ts                | 3 +--
 playground/vue/__tests__/vue.spec.ts                    | 3 +--
 4 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index 42a5238558a165..d6feb33a2c050c 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -19,8 +19,8 @@ async function createDefinePluginTransform(
   }
 }
 
-// FIXME: Insert \0 to prevent Vite from replacing special constants in string literals
-const importMetaEnv = 'import\0.meta.env'.replace(/\0/g, '')
+// FIXME: Use string concatenation to workaround Vite define-replacement of import\.meta.env in string literals
+const importMetaEnv = 'import' + '.meta.env'
 
 describe('definePlugin', () => {
   test('replaces custom define', async () => {
diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 3cf4cb2891fcdf..b37873d8b460de 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -46,7 +46,10 @@ export function definePlugin(config: ResolvedConfig): Plugin {
       ...config.env,
       SSR: !!config.build.ssr
     }
-    const importMetaEnv = 'import\0.meta.env'.replace(/\0/g, '')
+
+    // FIXME: Use string concatenation to workaround Vite define-replacement of import\.meta.env in string literals
+    const importMetaEnv = 'import' + '.meta.env'
+
     for (const key in env) {
       importMetaKeys[`${importMetaEnv}.${key}`] = JSON.stringify(env[key])
     }
diff --git a/playground/react/__tests__/react.spec.ts b/playground/react/__tests__/react.spec.ts
index 1b3700dd0bdcfb..f9d7834af1d479 100644
--- a/playground/react/__tests__/react.spec.ts
+++ b/playground/react/__tests__/react.spec.ts
@@ -40,7 +40,6 @@ test.runIf(isServe)(
 
 test('defined/reserved words are preserved in string literals', async () => {
   expect(await page.textContent('.define-variable')).toBe(
-    // FIXME: insert \0 to prevent Vite from replacing import.meta.env
-    'import\0.meta.env'.replace('\0', '')
+    'import' + '.meta.env' // FIXME: Workaround Vite replacement of import\0.meta.env
   )
 })
diff --git a/playground/vue/__tests__/vue.spec.ts b/playground/vue/__tests__/vue.spec.ts
index b8e81d19aceb4d..db7b2f0496d93e 100644
--- a/playground/vue/__tests__/vue.spec.ts
+++ b/playground/vue/__tests__/vue.spec.ts
@@ -267,8 +267,7 @@ describe('vue worker', () => {
 describe('defined/reserved words', () => {
   test('are preserved in string literals', async () => {
     expect(await page.textContent('.define-variable')).toBe(
-      // FIXME: insert \0 to prevent Vite from replacing import\0.meta.env
-      'import\0.meta.env'.replace('\0', '')
+      'import' + '.meta.env' // FIXME: Workaround Vite replacement of import\0.meta.env
     )
   })
 })

From bb34dd12da630df982f9d4c7a371841684f59217 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Wed, 24 Aug 2022 19:20:23 -0500
Subject: [PATCH 22/40] chore(define): typo

---
 packages/vite/src/node/__tests__/plugins/define.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index d6feb33a2c050c..ad156df877412f 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -70,7 +70,7 @@ describe('definePlugin', () => {
     'process.env.NODE_ENV': null,
     'global.process.env.NODE_ENV': null,
     'globalThis.process.env.NODE_ENV': null,
-    // __vite_process_env_NODE_ENV is a special variable to resolves to process.env.NODE_ENV, which is not replaced in SSR
+    // __vite_process_env_NODE_ENV is a special variable that resolves to process.env.NODE_ENV, which is not replaced in SSR
     __vite_process_env_NODE_ENV: 'process.env.NODE_ENV'
   }
 

From cbff5c6c9ab219ca86fe86a354daff95ad478236 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 25 Aug 2022 12:49:40 -0500
Subject: [PATCH 23/40] test(define): fix missing backticks in multiline tests

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

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index ad156df877412f..e50aa499233144 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -85,10 +85,10 @@ describe('definePlugin', () => {
       .map((define) => `let x = \`${define}\``)
       .join(';\n')
     const singleQuotedDefinesMultilineNested = specialDefineKeys
-      .map((define) => `let x = \n'${define}'\n\``)
+      .map((define) => `let x = \`\n'${define}'\n\``)
       .join(';\n')
     const doubleQuotedDefinesMultilineNested = specialDefineKeys
-      .map((define) => `let x = \n"${define}"\n\``)
+      .map((define) => `let x = \`\n"${define}"\n\``)
       .join(';\n')
     const backtickedDefinesMultilineNested = specialDefineKeys
       .map((define) => `let x = \`\n${define}\n\``)

From 2b5bf2b3b41dc975631d27b9ff26fba5f3d66eef Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 25 Aug 2022 12:57:47 -0500
Subject: [PATCH 24/40] test(define): remove invalid test

---
 packages/vite/src/node/__tests__/plugins/define.spec.ts | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index e50aa499233144..b880e280b85c0e 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -90,17 +90,13 @@ describe('definePlugin', () => {
     const doubleQuotedDefinesMultilineNested = specialDefineKeys
       .map((define) => `let x = \`\n"${define}"\n\``)
       .join(';\n')
-    const backtickedDefinesMultilineNested = specialDefineKeys
-      .map((define) => `let x = \`\n${define}\n\``)
-      .join(';\n')
 
     const inputs = [
       ['double-quoted', doubleQuotedDefines],
       ['single-quoted', singleQuotedDefines],
       ['backticked', backtickedDefines],
       ['multiline nested double-quoted', doubleQuotedDefinesMultilineNested],
-      ['multiline nested single-quoted', singleQuotedDefinesMultilineNested],
-      ['multiline nested backticked', backtickedDefinesMultilineNested]
+      ['multiline nested single-quoted', singleQuotedDefinesMultilineNested]
     ]
 
     describe('non-SSR', async () => {

From 75ff4868bd4c1d4ffcaa81918e12a48a8fea1099 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Wed, 31 Aug 2022 23:26:22 -0500
Subject: [PATCH 25/40] refactor(define): move string replacement code into
 utils

---
 .../vite/src/node/__tests__/utils.spec.ts     | 22 +++++++++
 packages/vite/src/node/plugins/define.ts      | 30 ++-----------
 packages/vite/src/node/utils.ts               | 45 ++++++++++++++++++-
 3 files changed, 69 insertions(+), 28 deletions(-)

diff --git a/packages/vite/src/node/__tests__/utils.spec.ts b/packages/vite/src/node/__tests__/utils.spec.ts
index 51990edf709da2..5bcfa7b8b68271 100644
--- a/packages/vite/src/node/__tests__/utils.spec.ts
+++ b/packages/vite/src/node/__tests__/utils.spec.ts
@@ -6,6 +6,7 @@ import {
   getPotentialTsSrcPaths,
   injectQuery,
   isWindows,
+  replaceInCode,
   resolveHostname
 } from '../utils'
 
@@ -177,3 +178,24 @@ describe('asyncFlatten', () => {
     expect(arr).toEqual([1, 2, 3, 4, 5, 6, 7, 8, 9])
   })
 })
+
+describe('replaceInCode', () => {
+  test('replaces pattern with string', () => {
+    expect(replaceInCode('let a1 = 1;', /\d/g, 'b')?.toString()).toBe(
+      'let ab = b;'
+    )
+  })
+
+  test('replaces pattern with replacement object', () => {
+    expect(
+      replaceInCode('let a1 = 2;', /\d/g, {
+        '1': 'b',
+        '2': 'c'
+      })?.toString()
+    ).toBe('let ab = c;')
+  })
+
+  test('returns null if no replacement', () => {
+    expect(replaceInCode('let a = b;', /\d/g, {})).toBe(null)
+  })
+})
diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index b37873d8b460de..8ffbe4dc9cefcd 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -1,8 +1,6 @@
-import MagicString from 'magic-string'
-import { stripLiteral } from 'strip-literal'
 import type { ResolvedConfig } from '../config'
 import type { Plugin } from '../plugin'
-import { transformStableResult } from '../utils'
+import { replaceInCode, transformStableResult } from '../utils'
 import { isCSSRequest } from './css'
 import { isHTMLRequest } from './html'
 
@@ -128,30 +126,8 @@ export function definePlugin(config: ResolvedConfig): Plugin {
         return null
       }
 
-      const maybeNeedsReplacement = new RegExp(pattern).test(code)
-      if (!maybeNeedsReplacement) {
-        return null
-      }
-
-      const s = new MagicString(code)
-      let hasReplaced = false
-      let match: RegExpExecArray | null
-
-      code = stripLiteral(code)
-
-      while ((match = pattern.exec(code))) {
-        hasReplaced = true
-        const start = match.index
-        const end = start + match[0].length
-        const replacement = '' + replacements[match[1]]
-        s.overwrite(start, end, replacement, { contentOnly: true })
-      }
-
-      if (!hasReplaced) {
-        return null
-      }
-
-      return transformStableResult(s, id, config)
+      const s = replaceInCode(code, pattern, replacements)
+      return s ? transformStableResult(s, id, config) : null
     }
   }
 }
diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts
index 0f681ec8f7378f..956ca3490131c3 100644
--- a/packages/vite/src/node/utils.ts
+++ b/packages/vite/src/node/utils.ts
@@ -8,6 +8,7 @@ import { builtinModules, createRequire } from 'node:module'
 import { promises as dns } from 'node:dns'
 import { performance } from 'node:perf_hooks'
 import type { AddressInfo, Server } from 'node:net'
+import { stripLiteral } from 'strip-literal'
 import resolve from 'resolve'
 import type { FSWatcher } from 'chokidar'
 import remapping from '@ampproject/remapping'
@@ -15,7 +16,7 @@ import type { DecodedSourceMap, RawSourceMap } from '@ampproject/remapping'
 import colors from 'picocolors'
 import debug from 'debug'
 import type { Alias, AliasOptions } from 'types/alias'
-import type MagicString from 'magic-string'
+import MagicString from 'magic-string'
 
 import type { TransformResult } from 'rollup'
 import { createFilter as _createFilter } from '@rollup/pluginutils'
@@ -1150,3 +1151,45 @@ export const isNonDriveRelativeAbsolutePath = (p: string): boolean => {
   if (!isWindows) return p.startsWith('/')
   return windowsDrivePathPrefixRE.test(p)
 }
+
+/**
+ * Replaces strings within JS code without touching string literals or comments
+ *
+ * @param code JavaScript to analyze
+ * @param pattern regular expression to match in code
+ * @param replacements a map of strings to replace matches with; or a string
+ * @returns transformed code
+ */
+export function replaceInCode(
+  code: string,
+  pattern: RegExp,
+  replacements: Record<string, string | undefined> | string
+): MagicString | null {
+  const maybeNeedsReplacement = new RegExp(pattern).test(code)
+  if (!maybeNeedsReplacement) {
+    return null
+  }
+
+  const s = new MagicString(code)
+  let hasReplaced = false
+  let match: RegExpExecArray | null
+
+  code = stripLiteral(code)
+
+  while ((match = pattern.exec(code))) {
+    hasReplaced = true
+    const start = match.index
+    const end = start + match[0].length
+    const replacement =
+      typeof replacements === 'string'
+        ? replacements
+        : replacements[match[0]] ?? ''
+    s.overwrite(start, end, replacement, { contentOnly: true })
+  }
+
+  if (!hasReplaced) {
+    return null
+  }
+
+  return s
+}

From c5736edea43dc11301080be92bae84be670cfe70 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 25 Aug 2022 23:28:54 -0500
Subject: [PATCH 26/40] test(define): add playground tests

---
 playground/define/__tests__/define.spec.ts |  98 ++++++++++++++++-
 playground/define/index.html               | 117 +++++++++++++++++++++
 2 files changed, 213 insertions(+), 2 deletions(-)

diff --git a/playground/define/__tests__/define.spec.ts b/playground/define/__tests__/define.spec.ts
index 43787ef0adb112..d0199e760d7fe7 100644
--- a/playground/define/__tests__/define.spec.ts
+++ b/playground/define/__tests__/define.spec.ts
@@ -2,9 +2,9 @@ import { expect, test } from 'vitest'
 import viteConfig from '../vite.config'
 import { page } from '~utils'
 
-test('string', async () => {
-  const defines = viteConfig.define
+const defines = viteConfig.define
 
+test('string', async () => {
   expect(await page.textContent('.exp')).toBe(
     String(typeof eval(defines.__EXP__))
   )
@@ -45,3 +45,97 @@ test('string', async () => {
     defines.__STRINGIFIED_OBJ__
   )
 })
+
+test('ignores constants in string literals', async () => {
+  expect(
+    await page.textContent('.ignores-string-literals .process-env-dot')
+  ).toBe('process.env.')
+  expect(
+    await page.textContent('.ignores-string-literals .global-process-env-dot')
+  ).toBe('global.process.env.')
+  expect(
+    await page.textContent(
+      '.ignores-string-literals .globalThis-process-env-dot'
+    )
+  ).toBe('globalThis.process.env.')
+  expect(
+    await page.textContent('.ignores-string-literals .process-env-NODE_ENV')
+  ).toBe('process.env.NODE_ENV')
+  expect(
+    await page.textContent(
+      '.ignores-string-literals .global-process-env-NODE_ENV'
+    )
+  ).toBe('global.process.env.NODE_ENV')
+  expect(
+    await page.textContent(
+      '.ignores-string-literals .globalThis-process-env-NODE_ENV'
+    )
+  ).toBe('globalThis.process.env.NODE_ENV')
+  expect(
+    await page.textContent(
+      '.ignores-string-literals .__vite_process_env_NODE_ENV'
+    )
+  ).toBe('__vite_process_env_NODE_ENV')
+  expect(
+    await page.textContent('.ignores-string-literals .import-meta-env-dot')
+  ).toBe('import.meta.env.')
+  expect(
+    await page.textContent('.ignores-string-literals .import-meta-env')
+  ).toBe('import.meta.env')
+  expect(
+    await page.textContent('.ignores-string-literals .import-meta-hot')
+  ).toBe('import.meta.hot')
+})
+
+test('replaces strings in template literal expressions', async () => {
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .process-env-dot'
+    )
+  ).toBe(defines.process.env.SOMEVAR)
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .global-process-env-dot'
+    )
+  ).toBe(defines.process.env.SOMEVAR)
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .globalThis-process-env-dot'
+    )
+  ).toBe(defines.process.env.SOMEVAR)
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .process-env-NODE_ENV'
+    )
+  ).toBe('"test"')
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .global-process-env-NODE_ENV'
+    )
+  ).toBe('"test"')
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .globalThis-process-env-NODE_ENV'
+    )
+  ).toBe('"test"')
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .__vite_process_env_NODE_ENV'
+    )
+  ).toBe('"test"')
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .import-meta-env-dot'
+    )
+  ).toBe(defines.process.env.SOMEVAR)
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .import-meta-env'
+    )
+  ).toBe('({})')
+  expect(
+    await page.textContent(
+      '.replaces-constants-in-template-literal-expressions .import-meta-hot'
+    )
+  ).toBe('false')
+})
diff --git a/playground/define/index.html b/playground/define/index.html
index c4f4c598aba563..c3e0e6a24cb976 100644
--- a/playground/define/index.html
+++ b/playground/define/index.html
@@ -18,6 +18,56 @@ <h1>Define</h1>
 <p>import json: <code class="import-json"></code></p>
 <p>define in dep: <code class="define-in-dep"></code></p>
 
+<h2>Define ignores string literals</h2>
+<section class="ignores-string-literals">
+  <p>process.env. <code class="process-env-dot"></code></p>
+  <p>global.process.env. <code class="global-process-env-dot"></code></p>
+  <p>
+    globalThis.process.env. <code class="globalThis-process-env-dot"></code>
+  </p>
+  <p>process.env.NODE_ENV <code class="process-env-NODE_ENV"></code></p>
+  <p>
+    global.process.env.NODE_ENV
+    <code class="global-process-env-NODE_ENV"></code>
+  </p>
+  <p>
+    globalThis.process.env.NODE_ENV
+    <code class="globalThis-process-env-NODE_ENV"></code>
+  </p>
+  <p>
+    __vite_process_env_NODE_ENV
+    <code class="__vite_process_env_NODE_ENV"></code>
+  </p>
+  <p>import.meta.env. <code class="import-meta-env-dot"></code></p>
+  <p>import.meta.env <code class="import-meta-env"></code></p>
+  <p>import.meta.hot <code class="import-meta-hot"></code></p>
+</section>
+
+<h2>Define replaces constants in template literal expressions</h2>
+<section class="replaces-constants-in-template-literal-expressions">
+  <p>process.env. <code class="process-env-dot"></code></p>
+  <p>global.process.env. <code class="global-process-env-dot"></code></p>
+  <p>
+    globalThis.process.env. <code class="globalThis-process-env-dot"></code>
+  </p>
+  <p>process.env.NODE_ENV <code class="process-env-NODE_ENV"></code></p>
+  <p>
+    global.process.env.NODE_ENV
+    <code class="global-process-env-NODE_ENV"></code>
+  </p>
+  <p>
+    globalThis.process.env.NODE_ENV
+    <code class="globalThis-process-env-NODE_ENV"></code>
+  </p>
+  <p>
+    __vite_process_env_NODE_ENV
+    <code class="__vite_process_env_NODE_ENV"></code>
+  </p>
+  <p>import.meta.env. <code class="import-meta-env-dot"></code></p>
+  <p>import.meta.env <code class="import-meta-env"></code></p>
+  <p>import.meta.hot <code class="import-meta-hot"></code></p>
+</section>
+
 <script type="module">
   const __VAR_NAME__ = true // ensure define doesn't replace var name
   text('.exp', typeof __EXP__) // typeof __EXP__ would be `boolean` instead of `string`
@@ -54,6 +104,73 @@ <h1>Define</h1>
 
   import { defined } from 'dep'
   text('.define-in-dep', JSON.stringify(defined))
+
+  text('.ignores-string-literals .process-env-dot', 'process.env.')
+  text(
+    '.ignores-string-literals .global-process-env-dot',
+    'global.process.env.'
+  )
+  text(
+    '.ignores-string-literals .globalThis-process-env-dot',
+    'globalThis.process.env.'
+  )
+  text('.ignores-string-literals .process-env-NODE_ENV', 'process.env.NODE_ENV')
+  text(
+    '.ignores-string-literals .global-process-env-NODE_ENV',
+    'global.process.env.NODE_ENV'
+  )
+  text(
+    '.ignores-string-literals .globalThis-process-env-NODE_ENV',
+    'globalThis.process.env.NODE_ENV'
+  )
+  text(
+    '.ignores-string-literals .vite-process-env-NODE_ENV',
+    '__vite_process_env_NODE_ENV'
+  )
+  text('.ignores-string-literals .import-meta-env-dot', 'import.meta.env.')
+  text('.ignores-string-literals .import-meta-env', 'import.meta.env')
+  text('.ignores-string-literals .import-meta-hot', 'import.meta.hot')
+
+  text(
+    '.replaces-constants-in-template-literal-expressions .process-env-dot',
+    `${process.env.SOMEVAR}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .global-process-env-dot',
+    `${global.process.env.SOMEVAR}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .globalThis-process-env-dot',
+    `${globalThis.process.env.SOMEVAR}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .process-env-NODE_ENV',
+    `${process.env.NODE_ENV}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .global-process-env-NODE_ENV',
+    `${global.process.env.NODE_ENV}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .globalThis-process-env-NODE_ENV',
+    `${globalThis.process.env.NODE_ENV}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .vite-process-env-NODE_ENV',
+    `${__vite_process_env_NODE_ENV}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .import-meta-env-dot',
+    `${import.meta.env.SOMEVAR}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .import-meta-env',
+    `${import.meta.env}`
+  )
+  text(
+    '.replaces-constants-in-template-literal-expressions .import-meta-hot',
+    `${import.meta.hot}`
+  )
 </script>
 
 <style>

From ae211b5e0d4913a36af8aba94a592b6e88ebcb74 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Wed, 31 Aug 2022 20:13:00 -0500
Subject: [PATCH 27/40] docs(define): describe new string replacement behavior

---
 docs/config/shared-options.md | 4 +++-
 docs/guide/env-and-mode.md    | 6 ++++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/docs/config/shared-options.md b/docs/config/shared-options.md
index a51350d05c462b..5a3ce523068cea 100644
--- a/docs/config/shared-options.md
+++ b/docs/config/shared-options.md
@@ -39,12 +39,14 @@ Define global constant replacements. Entries will be defined as globals during d
 
 - Starting from `2.0.0-beta.70`, string values will be used as raw expressions, so if defining a string constant, it needs to be explicitly quoted (e.g. with `JSON.stringify`).
 
+- Starting from `3.1.0`, defined constants within string literals and comments are ignored. For example, `process.env.NODE_ENV` is not replaced in `console.log('mode is process.env.NODE_ENV') /* process.env.NODE_ENV */`.
+
 - To be consistent with [esbuild behavior](https://esbuild.github.io/api/#define), expressions must either be a JSON object (null, boolean, number, string, array, or object) or a single identifier.
 
 - Replacements are performed only when the match isn't surrounded by other letters, numbers, `_` or `$`.
 
 ::: warning
-Because it's implemented as straightforward text replacements without any syntax analysis, we recommend using `define` for CONSTANTS only.
+Because it's implemented as straightforward text replacements without any syntax analysis (pre Vite 3.1.0), we recommend using `define` for CONSTANTS only.
 
 For example, `process.env.FOO` and `__APP_VERSION__` are good fits. But `process` or `global` should not be put into this option. Variables can be shimmed or polyfilled instead.
 :::
diff --git a/docs/guide/env-and-mode.md b/docs/guide/env-and-mode.md
index c69badcda5db2e..e243c25523ecc0 100644
--- a/docs/guide/env-and-mode.md
+++ b/docs/guide/env-and-mode.md
@@ -18,9 +18,11 @@ Vite exposes env variables on the special **`import.meta.env`** object. Some bui
 
 During production, these env variables are **statically replaced**. It is therefore necessary to always reference them using the full static string. For example, dynamic key access like `import.meta.env[key]` will not work.
 
-It will also replace these strings appearing in JavaScript strings and Vue templates. This should be a rare case, but it can be unintended. You may see errors like `Missing Semicolon` or `Unexpected token` in this case, for example when `"process.env.`<wbr>`NODE_ENV"` is transformed to `""development": "`. There are ways to work around this behavior:
+Before version 3.1.0, Vite also replaces environment variables (and other [defined constants](/config/shared-options.html#define)) within string literals and comments. This could result in unintentional changes to your string literals that result in invalid JavaScript syntax, causing errors like `Missing ) after argument list`, `Missing semicolon`, or `Unexpected token`. For example, you'd see an error when `console.log("This is process.env.`<wbr>`NODE_ENV")` is transformed to `console.log("This is "development"")`.
 
-- For JavaScript strings, you can break the string up with a Unicode zero-width space, e.g. `'import.meta\u200b.env.MODE'`.
+There are ways to work around this string replacement behavior:
+
+- For JavaScript strings, you can break the string up with a Unicode zero-width space, e.g. `'import.meta\0.env.MODE'` or use string concatenation, e.g. `'import' + '.meta.env.MODE'`.
 
 - For Vue templates or other HTML that gets compiled into JavaScript strings, you can use the [`<wbr>` tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/wbr), e.g. `import.meta.<wbr>env.MODE`.
 

From e41792a76b0f182393ee03abb4b189e744e1fd33 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Wed, 31 Aug 2022 20:31:51 -0500
Subject: [PATCH 28/40] chore: link to vitest issue in fixme comments

---
 packages/vite/src/node/__tests__/plugins/define.spec.ts | 2 +-
 packages/vite/src/node/plugins/define.ts                | 2 +-
 playground/react/__tests__/react.spec.ts                | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index b880e280b85c0e..6106d15377d6d7 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -19,7 +19,7 @@ async function createDefinePluginTransform(
   }
 }
 
-// FIXME: Use string concatenation to workaround Vite define-replacement of import\.meta.env in string literals
+// FIXME: Use string concatenation to workaround https://github.com/vitest-dev/vitest/issues/1941
 const importMetaEnv = 'import' + '.meta.env'
 
 describe('definePlugin', () => {
diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 8ffbe4dc9cefcd..7fb153a0653c2d 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -45,7 +45,7 @@ export function definePlugin(config: ResolvedConfig): Plugin {
       SSR: !!config.build.ssr
     }
 
-    // FIXME: Use string concatenation to workaround Vite define-replacement of import\.meta.env in string literals
+    // FIXME: Use string concatenation to workaround https://github.com/vitest-dev/vitest/issues/1941
     const importMetaEnv = 'import' + '.meta.env'
 
     for (const key in env) {
diff --git a/playground/react/__tests__/react.spec.ts b/playground/react/__tests__/react.spec.ts
index f9d7834af1d479..e465e69f63ceda 100644
--- a/playground/react/__tests__/react.spec.ts
+++ b/playground/react/__tests__/react.spec.ts
@@ -40,6 +40,6 @@ test.runIf(isServe)(
 
 test('defined/reserved words are preserved in string literals', async () => {
   expect(await page.textContent('.define-variable')).toBe(
-    'import' + '.meta.env' // FIXME: Workaround Vite replacement of import\0.meta.env
+    'import' + '.meta.env' // FIXME: Use string concatenation to workaround https://github.com/vitest-dev/vitest/issues/1941
   )
 })

From 46a291b85bdd40ff0000b8a98c2e8070ebd607fe Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Fri, 26 Aug 2022 00:34:00 -0500
Subject: [PATCH 29/40] test(define): add playground tests

---
 playground/define/__tests__/define.spec.ts | 54 ++--------------------
 playground/define/index.html               | 40 +---------------
 playground/env/__tests__/env.spec.ts       | 26 +++++++++++
 playground/env/index.html                  | 23 +++++++++
 4 files changed, 54 insertions(+), 89 deletions(-)

diff --git a/playground/define/__tests__/define.spec.ts b/playground/define/__tests__/define.spec.ts
index d0199e760d7fe7..43e260715b5192 100644
--- a/playground/define/__tests__/define.spec.ts
+++ b/playground/define/__tests__/define.spec.ts
@@ -76,66 +76,20 @@ test('ignores constants in string literals', async () => {
       '.ignores-string-literals .__vite_process_env_NODE_ENV'
     )
   ).toBe('__vite_process_env_NODE_ENV')
-  expect(
-    await page.textContent('.ignores-string-literals .import-meta-env-dot')
-  ).toBe('import.meta.env.')
-  expect(
-    await page.textContent('.ignores-string-literals .import-meta-env')
-  ).toBe('import.meta.env')
   expect(
     await page.textContent('.ignores-string-literals .import-meta-hot')
-  ).toBe('import.meta.hot')
+  ).toBe('import' + '.meta.hot')
 })
 
-test('replaces strings in template literal expressions', async () => {
+test('replaces constants in template literal expressions', async () => {
   expect(
     await page.textContent(
       '.replaces-constants-in-template-literal-expressions .process-env-dot'
     )
-  ).toBe(defines.process.env.SOMEVAR)
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .global-process-env-dot'
-    )
-  ).toBe(defines.process.env.SOMEVAR)
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .globalThis-process-env-dot'
-    )
-  ).toBe(defines.process.env.SOMEVAR)
+  ).toBe(JSON.parse(defines['process.env.SOMEVAR']))
   expect(
     await page.textContent(
       '.replaces-constants-in-template-literal-expressions .process-env-NODE_ENV'
     )
-  ).toBe('"test"')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .global-process-env-NODE_ENV'
-    )
-  ).toBe('"test"')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .globalThis-process-env-NODE_ENV'
-    )
-  ).toBe('"test"')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .__vite_process_env_NODE_ENV'
-    )
-  ).toBe('"test"')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .import-meta-env-dot'
-    )
-  ).toBe(defines.process.env.SOMEVAR)
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .import-meta-env'
-    )
-  ).toBe('({})')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .import-meta-hot'
-    )
-  ).toBe('false')
+  ).toBe('dev')
 })
diff --git a/playground/define/index.html b/playground/define/index.html
index c3e0e6a24cb976..ef46d284c0823d 100644
--- a/playground/define/index.html
+++ b/playground/define/index.html
@@ -38,8 +38,6 @@ <h2>Define ignores string literals</h2>
     __vite_process_env_NODE_ENV
     <code class="__vite_process_env_NODE_ENV"></code>
   </p>
-  <p>import.meta.env. <code class="import-meta-env-dot"></code></p>
-  <p>import.meta.env <code class="import-meta-env"></code></p>
   <p>import.meta.hot <code class="import-meta-hot"></code></p>
 </section>
 
@@ -63,8 +61,6 @@ <h2>Define replaces constants in template literal expressions</h2>
     __vite_process_env_NODE_ENV
     <code class="__vite_process_env_NODE_ENV"></code>
   </p>
-  <p>import.meta.env. <code class="import-meta-env-dot"></code></p>
-  <p>import.meta.env <code class="import-meta-env"></code></p>
   <p>import.meta.hot <code class="import-meta-hot"></code></p>
 </section>
 
@@ -124,53 +120,19 @@ <h2>Define replaces constants in template literal expressions</h2>
     'globalThis.process.env.NODE_ENV'
   )
   text(
-    '.ignores-string-literals .vite-process-env-NODE_ENV',
+    '.ignores-string-literals .__vite_process_env_NODE_ENV',
     '__vite_process_env_NODE_ENV'
   )
-  text('.ignores-string-literals .import-meta-env-dot', 'import.meta.env.')
-  text('.ignores-string-literals .import-meta-env', 'import.meta.env')
   text('.ignores-string-literals .import-meta-hot', 'import.meta.hot')
 
   text(
     '.replaces-constants-in-template-literal-expressions .process-env-dot',
     `${process.env.SOMEVAR}`
   )
-  text(
-    '.replaces-constants-in-template-literal-expressions .global-process-env-dot',
-    `${global.process.env.SOMEVAR}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .globalThis-process-env-dot',
-    `${globalThis.process.env.SOMEVAR}`
-  )
   text(
     '.replaces-constants-in-template-literal-expressions .process-env-NODE_ENV',
     `${process.env.NODE_ENV}`
   )
-  text(
-    '.replaces-constants-in-template-literal-expressions .global-process-env-NODE_ENV',
-    `${global.process.env.NODE_ENV}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .globalThis-process-env-NODE_ENV',
-    `${globalThis.process.env.NODE_ENV}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .vite-process-env-NODE_ENV',
-    `${__vite_process_env_NODE_ENV}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .import-meta-env-dot',
-    `${import.meta.env.SOMEVAR}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .import-meta-env',
-    `${import.meta.env}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .import-meta-hot',
-    `${import.meta.hot}`
-  )
 </script>
 
 <style>
diff --git a/playground/env/__tests__/env.spec.ts b/playground/env/__tests__/env.spec.ts
index 0fe029422ecfbd..539f040e2d5715 100644
--- a/playground/env/__tests__/env.spec.ts
+++ b/playground/env/__tests__/env.spec.ts
@@ -23,6 +23,10 @@ test('custom', async () => {
   expect(await page.textContent('.custom')).toBe('1')
 })
 
+test('custom in template literal expression', async () => {
+  expect(await page.textContent('.custom-template-literal-exp')).toBe('1')
+})
+
 test('custom-prefix', async () => {
   expect(await page.textContent('.custom-prefix')).toBe('1')
 })
@@ -58,8 +62,30 @@ test('env object', async () => {
   })
 })
 
+test('env object in template literal expression', async () => {
+  const envText = await page.textContent('.env-object-in-template-literal-exp')
+  expect(JSON.parse(envText)).toMatchObject({
+    VITE_EFFECTIVE_MODE_FILE_NAME: `.env.${mode}`,
+    CUSTOM_PREFIX_ENV_VARIABLE: '1',
+    VITE_CUSTOM_ENV_VARIABLE: '1',
+    BASE_URL: '/env/',
+    MODE: mode,
+    DEV: !isBuild,
+    PROD: isBuild
+  })
+})
+
 if (!isBuild) {
   test('relative url import script return import.meta.url', async () => {
     expect(await page.textContent('.url')).toMatch('/env/index.js')
   })
 }
+
+test('ignores import' + '.meta.env in string literals', async () => {
+  expect(await page.textContent('.ignores-literal-import-meta-env-dot')).toBe(
+    'import' + '.meta.env.'
+  )
+  expect(await page.textContent('.ignores-literal-import-meta-env')).toBe(
+    'import' + '.meta.env'
+  )
+})
diff --git a/playground/env/index.html b/playground/env/index.html
index 46752dbc2c5ab1..9d6a90ab3bf30a 100644
--- a/playground/env/index.html
+++ b/playground/env/index.html
@@ -4,6 +4,10 @@ <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.VITE_CUSTOM_ENV_VARIABLE}:
+  <code class="custom-template-literal-exp"></code>
+</p>
 <p>
   import.meta.env.CUSTOM_PREFIX_ENV_VARIABLE:
   <code class="custom-prefix"></code>
@@ -15,20 +19,39 @@ <h1>Environment Variables</h1>
 <p>typeof import.meta.env.VITE_BOOL: <code class="bool"></code></p>
 <p>process.env.NODE_ENV: <code class="node-env"></code></p>
 <p>import.meta.env: <span class="pre env-object"></span></p>
+<p>
+  ${import.meta.env}:
+  <span class="pre env-object-in-template-literal-exp"></span>
+</p>
 <p>import.meta.url: <span class="pre url"></span></p>
 
+<p>
+  import.meta.env. <code class="ignores-literal-import-meta-env-dot"></code>
+</p>
+<p>import.meta.env <code class="ignores-literal-import-meta-env"></code></p>
+
 <script type="module">
   text('.base', import.meta.env.BASE_URL)
   text('.mode', import.meta.env.MODE)
   text('.dev', import.meta.env.DEV)
   text('.prod', import.meta.env.PROD)
   text('.custom', import.meta.env.VITE_CUSTOM_ENV_VARIABLE)
+  text(
+    '.custom-template-literal-exp',
+    `${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('.bool', typeof import.meta.env.VITE_BOOL)
   text('.node-env', process.env.NODE_ENV)
   text('.env-object', JSON.stringify(import.meta.env, null, 2))
+  text(
+    '.env-object-in-template-literal-exp',
+    `${JSON.stringify(import.meta.env, null, 2)}`
+  )
+  text('.ignores-literal-import-meta-env-dot', 'import' + '.meta.env.')
+  text('.ignores-literal-import-meta-env', 'import' + '.meta.env')
 
   function text(el, text) {
     document.querySelector(el).textContent = text

From bce6fe23b3b3ef925478b833220f89b9fe3b2765 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 1 Sep 2022 00:22:45 -0500
Subject: [PATCH 30/40] test(define): skip tests for 'process.env.NODE_ENV'
 until #9829 fix

---
 playground/define/__tests__/define.spec.ts | 27 +++++++++++-----------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/playground/define/__tests__/define.spec.ts b/playground/define/__tests__/define.spec.ts
index 43e260715b5192..4dcdf5f1edda5e 100644
--- a/playground/define/__tests__/define.spec.ts
+++ b/playground/define/__tests__/define.spec.ts
@@ -58,19 +58,20 @@ test('ignores constants in string literals', async () => {
       '.ignores-string-literals .globalThis-process-env-dot'
     )
   ).toBe('globalThis.process.env.')
-  expect(
-    await page.textContent('.ignores-string-literals .process-env-NODE_ENV')
-  ).toBe('process.env.NODE_ENV')
-  expect(
-    await page.textContent(
-      '.ignores-string-literals .global-process-env-NODE_ENV'
-    )
-  ).toBe('global.process.env.NODE_ENV')
-  expect(
-    await page.textContent(
-      '.ignores-string-literals .globalThis-process-env-NODE_ENV'
-    )
-  ).toBe('globalThis.process.env.NODE_ENV')
+  // FIXME: Skip tests until vitejs/vite#9829 is fixed
+  // expect(
+  //   await page.textContent('.ignores-string-literals .process-env-NODE_ENV')
+  // ).toBe('process.env.NODE_ENV')
+  // expect(
+  //   await page.textContent(
+  //     '.ignores-string-literals .global-process-env-NODE_ENV'
+  //   )
+  // ).toBe('global.process.env.NODE_ENV')
+  // expect(
+  //   await page.textContent(
+  //     '.ignores-string-literals .globalThis-process-env-NODE_ENV'
+  //   )
+  // ).toBe('globalThis.process.env.NODE_ENV')
   expect(
     await page.textContent(
       '.ignores-string-literals .__vite_process_env_NODE_ENV'

From b40fd9187f897b0695f6d4a0adccf21d57c2f1bd Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 1 Sep 2022 00:48:25 -0500
Subject: [PATCH 31/40] perf(define): don't compare id if no replacements
 needed

---
 packages/vite/src/node/plugins/define.ts | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 7fb153a0653c2d..eee640e5890ab5 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -110,6 +110,11 @@ export function definePlugin(config: ResolvedConfig): Plugin {
         return
       }
 
+      const [replacements, pattern] = ssr ? ssrPattern : defaultPattern
+      if (!pattern) {
+        return null
+      }
+
       if (
         // exclude html, css and static assets for performance
         isHTMLRequest(id) ||
@@ -120,12 +125,6 @@ export function definePlugin(config: ResolvedConfig): Plugin {
         return
       }
 
-      const [replacements, pattern] = ssr ? ssrPattern : defaultPattern
-
-      if (!pattern) {
-        return null
-      }
-
       const s = replaceInCode(code, pattern, replacements)
       return s ? transformStableResult(s, id, config) : null
     }

From 2e9460da3998fe51ddaf199e1286b67af6548b0c Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 1 Sep 2022 01:04:49 -0500
Subject: [PATCH 32/40] chore: fix docs comment for replaceInCode

---
 packages/vite/src/node/utils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts
index 956ca3490131c3..8ca295a853f579 100644
--- a/packages/vite/src/node/utils.ts
+++ b/packages/vite/src/node/utils.ts
@@ -1158,7 +1158,7 @@ export const isNonDriveRelativeAbsolutePath = (p: string): boolean => {
  * @param code JavaScript to analyze
  * @param pattern regular expression to match in code
  * @param replacements a map of strings to replace matches with; or a string
- * @returns transformed code
+ * @returns MagicString of transformed code; or null if no replacements were made
  */
 export function replaceInCode(
   code: string,

From 03836066612f5e738066ffdbd47350b68747130f Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Wed, 31 Aug 2022 23:27:21 -0500
Subject: [PATCH 33/40] fix(client-inject): don't modify string literals

fix #9829
---
 .../vite/src/node/plugins/clientInjections.ts | 48 ++++++++++++-------
 1 file changed, 30 insertions(+), 18 deletions(-)

diff --git a/packages/vite/src/node/plugins/clientInjections.ts b/packages/vite/src/node/plugins/clientInjections.ts
index c4472cb8f14b62..81523a8d3fb949 100644
--- a/packages/vite/src/node/plugins/clientInjections.ts
+++ b/packages/vite/src/node/plugins/clientInjections.ts
@@ -2,7 +2,12 @@ import path from 'node:path'
 import type { Plugin } from '../plugin'
 import type { ResolvedConfig } from '../config'
 import { CLIENT_ENTRY, ENV_ENTRY } from '../constants'
-import { isObject, normalizePath, resolveHostname } from '../utils'
+import {
+  isObject,
+  normalizePath,
+  replaceInCode,
+  resolveHostname
+} from '../utils'
 
 // ids in transform are normalized to unix style
 const normalizedClientEntry = normalizePath(CLIENT_ENTRY)
@@ -48,28 +53,35 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin {
           hmrBase = path.posix.join(hmrBase, hmrConfig.path)
         }
 
-        return code
-          .replace(`__MODE__`, JSON.stringify(config.mode))
-          .replace(`__BASE__`, JSON.stringify(devBase))
-          .replace(`__DEFINES__`, serializeDefine(config.define || {}))
-          .replace(`__SERVER_HOST__`, JSON.stringify(serverHost))
-          .replace(`__HMR_PROTOCOL__`, JSON.stringify(protocol))
-          .replace(`__HMR_HOSTNAME__`, JSON.stringify(host))
-          .replace(`__HMR_PORT__`, JSON.stringify(port))
-          .replace(`__HMR_DIRECT_TARGET__`, JSON.stringify(directTarget))
-          .replace(`__HMR_BASE__`, JSON.stringify(hmrBase))
-          .replace(`__HMR_TIMEOUT__`, JSON.stringify(timeout))
-          .replace(`__HMR_ENABLE_OVERLAY__`, JSON.stringify(overlay))
-      } else if (!options?.ssr && code.includes('process.env.NODE_ENV')) {
+        const replacements: Record<string, string> = {
+          __MODE__: JSON.stringify(config.mode),
+          __BASE__: JSON.stringify(devBase),
+          __DEFINES__: serializeDefine(config.define || {}),
+          __SERVER_HOST__: JSON.stringify(serverHost),
+          __HMR_PROTOCOL__: JSON.stringify(protocol),
+          __HMR_HOSTNAME__: JSON.stringify(host),
+          __HMR_PORT__: JSON.stringify(port),
+          __HMR_DIRECT_TARGET__: JSON.stringify(directTarget),
+          __HMR_BASE__: JSON.stringify(hmrBase),
+          __HMR_TIMEOUT__: JSON.stringify(timeout),
+          __HMR_ENABLE_OVERLAY__: JSON.stringify(overlay)
+        }
+        const pattern = new RegExp(Object.keys(replacements).join('|'), 'gu')
+        return replaceInCode(code, pattern, replacements)?.toString() ?? null
+      } else if (!options?.ssr) {
         // replace process.env.NODE_ENV instead of defining a global
         // for it to avoid shimming a `process` object during dev,
         // avoiding inconsistencies between dev and build
-        return code.replace(
-          /\bprocess\.env\.NODE_ENV\b/g,
-          config.define?.['process.env.NODE_ENV'] ||
-            JSON.stringify(process.env.NODE_ENV || config.mode)
+        return (
+          replaceInCode(
+            code,
+            /\bprocess\.env\.NODE_ENV\b/g,
+            config.define?.['process.env.NODE_ENV'] ||
+              JSON.stringify(process.env.NODE_ENV || config.mode)
+          )?.toString() ?? null
         )
       }
+      return null
     }
   }
 }

From 13034247b94f14203bcad85600246b277ce0270e Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 25 Aug 2022 19:31:51 -0500
Subject: [PATCH 34/40] test(client-inject): add unit tests

---
 .../plugins/clientInjections.spec.ts          | 91 +++++++++++++++++
 .../vite/src/node/plugins/clientInjections.ts | 99 ++++++++++---------
 2 files changed, 144 insertions(+), 46 deletions(-)
 create mode 100644 packages/vite/src/node/__tests__/plugins/clientInjections.spec.ts

diff --git a/packages/vite/src/node/__tests__/plugins/clientInjections.spec.ts b/packages/vite/src/node/__tests__/plugins/clientInjections.spec.ts
new file mode 100644
index 00000000000000..2fb594b9da6bd1
--- /dev/null
+++ b/packages/vite/src/node/__tests__/plugins/clientInjections.spec.ts
@@ -0,0 +1,91 @@
+import { describe, expect, test } from 'vitest'
+import {
+  clientInjectionsPlugin,
+  normalizedClientEntry,
+  normalizedEnvEntry,
+  resolveInjections
+} from '../../plugins/clientInjections'
+import { resolveConfig } from '../../config'
+
+async function createClientInjectionPluginTransform({
+  build = true,
+  ssr = false,
+  id = 'foo.ts'
+} = {}) {
+  const config = await resolveConfig({}, build ? 'build' : 'serve')
+  const instance = clientInjectionsPlugin(config)
+  const transform = async (code: string) => {
+    const transform =
+      instance.transform && 'handler' in instance.transform
+        ? instance.transform.handler
+        : instance.transform
+    const result = await transform?.call({}, code, id, { ssr })
+    return result?.code || result
+  }
+  return {
+    transform,
+    injections: resolveInjections(config)
+  }
+}
+
+describe('clientInjectionsPlugin', () => {
+  test('replaces process.env.NODE_ENV for non-SSR', async () => {
+    const { transform } = await createClientInjectionPluginTransform()
+    expect(await transform('let x = process.env.NODE_ENV;')).toBe(
+      'let x = "test";'
+    )
+  })
+
+  test('ignores process.env.NODE_ENV for SSR', async () => {
+    const { transform: ssrTransform } =
+      await createClientInjectionPluginTransform({
+        ssr: true
+      })
+    expect(await ssrTransform('let x = process.env.NODE_ENV;')).toBe(null)
+  })
+
+  test('ignores process.env.NODE_ENV inside string literal for non-SSR', async () => {
+    const { transform } = await createClientInjectionPluginTransform()
+    expect(await transform(`let x = 'process.env.NODE_ENV';`)).toBe(null)
+    expect(await transform('let x = "process.env.NODE_ENV";')).toBe(null)
+    expect(await transform('let x = `process.env.NODE_ENV`;')).toBe(null)
+  })
+
+  test('ignores process.env.NODE_ENV inside string literal for SSR', async () => {
+    const { transform: ssrTransform } =
+      await createClientInjectionPluginTransform({
+        ssr: true
+      })
+    expect(await ssrTransform(`let x = 'process.env.NODE_ENV';`)).toBe(null)
+    expect(await ssrTransform('let x = "process.env.NODE_ENV";')).toBe(null)
+    expect(await ssrTransform('let x = `process.env.NODE_ENV`;')).toBe(null)
+  })
+
+  test('replaces code injections for client entry', async () => {
+    const { injections, transform } =
+      await createClientInjectionPluginTransform({
+        id: normalizedClientEntry
+      })
+    test.each(Object.keys(injections))('replaces %s', async (key) => {
+      expect(await transform(key)).toBe(injections[key])
+    })
+  })
+
+  test('replaces code injections for env entry', async () => {
+    const { injections, transform } =
+      await createClientInjectionPluginTransform({
+        id: normalizedEnvEntry
+      })
+    test.each(Object.keys(injections))('replaces %s', async (key) => {
+      expect(await transform(key)).toBe(injections[key])
+    })
+  })
+
+  test('ignores code injections for non entry files', async () => {
+    const { injections, transform } =
+      await createClientInjectionPluginTransform()
+    test.each(Object.keys(injections))('replaces %s', async (key) => {
+      expect(await transform(key)).toBe(null)
+    })
+  })
+})
diff --git a/packages/vite/src/node/plugins/clientInjections.ts b/packages/vite/src/node/plugins/clientInjections.ts
index 81523a8d3fb949..958088b7d033b2 100644
--- a/packages/vite/src/node/plugins/clientInjections.ts
+++ b/packages/vite/src/node/plugins/clientInjections.ts
@@ -10,8 +10,58 @@ import {
 } from '../utils'
 
 // ids in transform are normalized to unix style
-const normalizedClientEntry = normalizePath(CLIENT_ENTRY)
-const normalizedEnvEntry = normalizePath(ENV_ENTRY)
+export const normalizedClientEntry = normalizePath(CLIENT_ENTRY)
+export const normalizedEnvEntry = normalizePath(ENV_ENTRY)
+
+export async function resolveInjections(
+  config: ResolvedConfig
+): Promise<Record<string, string>> {
+  const resolvedServerHostname = (await resolveHostname(config.server.host))
+    .name
+  const resolvedServerPort = config.server.port!
+  const devBase = config.base
+
+  const serverHost = `${resolvedServerHostname}:${resolvedServerPort}${devBase}`
+
+  let hmrConfig = config.server.hmr
+  hmrConfig = isObject(hmrConfig) ? hmrConfig : undefined
+  const host = hmrConfig?.host || null
+  const protocol = hmrConfig?.protocol || null
+  const timeout = hmrConfig?.timeout || 30000
+  const overlay = hmrConfig?.overlay !== false
+
+  // hmr.clientPort -> hmr.port
+  // -> (24678 if middleware mode) -> new URL(import.meta.url).port
+  let port = hmrConfig?.clientPort || hmrConfig?.port || null
+  if (config.server.middlewareMode) {
+    port ||= 24678
+  }
+
+  let directTarget = hmrConfig?.host || resolvedServerHostname
+  directTarget += `:${hmrConfig?.port || resolvedServerPort}`
+  directTarget += devBase
+
+  let hmrBase = devBase
+  if (hmrConfig?.path) {
+    hmrBase = path.posix.join(hmrBase, hmrConfig.path)
+  }
+
+  const replacements: Record<string, string> = {
+    __MODE__: JSON.stringify(config.mode),
+    __BASE__: JSON.stringify(devBase),
+    __DEFINES__: serializeDefine(config.define || {}),
+    __SERVER_HOST__: JSON.stringify(serverHost),
+    __HMR_PROTOCOL__: JSON.stringify(protocol),
+    __HMR_HOSTNAME__: JSON.stringify(host),
+    __HMR_PORT__: JSON.stringify(port),
+    __HMR_DIRECT_TARGET__: JSON.stringify(directTarget),
+    __HMR_BASE__: JSON.stringify(hmrBase),
+    __HMR_TIMEOUT__: JSON.stringify(timeout),
+    __HMR_ENABLE_OVERLAY__: JSON.stringify(overlay)
+  }
+
+  return replacements
+}
 
 /**
  * some values used by the client needs to be dynamically injected by the server
@@ -22,50 +72,7 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin {
     name: 'vite:client-inject',
     async transform(code, id, options) {
       if (id === normalizedClientEntry || id === normalizedEnvEntry) {
-        const resolvedServerHostname = (
-          await resolveHostname(config.server.host)
-        ).name
-        const resolvedServerPort = config.server.port!
-        const devBase = config.base
-
-        const serverHost = `${resolvedServerHostname}:${resolvedServerPort}${devBase}`
-
-        let hmrConfig = config.server.hmr
-        hmrConfig = isObject(hmrConfig) ? hmrConfig : undefined
-        const host = hmrConfig?.host || null
-        const protocol = hmrConfig?.protocol || null
-        const timeout = hmrConfig?.timeout || 30000
-        const overlay = hmrConfig?.overlay !== false
-
-        // hmr.clientPort -> hmr.port
-        // -> (24678 if middleware mode) -> new URL(import.meta.url).port
-        let port = hmrConfig?.clientPort || hmrConfig?.port || null
-        if (config.server.middlewareMode) {
-          port ||= 24678
-        }
-
-        let directTarget = hmrConfig?.host || resolvedServerHostname
-        directTarget += `:${hmrConfig?.port || resolvedServerPort}`
-        directTarget += devBase
-
-        let hmrBase = devBase
-        if (hmrConfig?.path) {
-          hmrBase = path.posix.join(hmrBase, hmrConfig.path)
-        }
-
-        const replacements: Record<string, string> = {
-          __MODE__: JSON.stringify(config.mode),
-          __BASE__: JSON.stringify(devBase),
-          __DEFINES__: serializeDefine(config.define || {}),
-          __SERVER_HOST__: JSON.stringify(serverHost),
-          __HMR_PROTOCOL__: JSON.stringify(protocol),
-          __HMR_HOSTNAME__: JSON.stringify(host),
-          __HMR_PORT__: JSON.stringify(port),
-          __HMR_DIRECT_TARGET__: JSON.stringify(directTarget),
-          __HMR_BASE__: JSON.stringify(hmrBase),
-          __HMR_TIMEOUT__: JSON.stringify(timeout),
-          __HMR_ENABLE_OVERLAY__: JSON.stringify(overlay)
-        }
+        const replacements = await resolveInjections(config)
         const pattern = new RegExp(Object.keys(replacements).join('|'), 'gu')
         return replaceInCode(code, pattern, replacements)?.toString() ?? null
       } else if (!options?.ssr) {

From 59c243288758f18001da7684a7124e7733f11d15 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 25 Aug 2022 19:33:45 -0500
Subject: [PATCH 35/40] test: update snapshots for client-inject tests

---
 .../plugins/importGlob/__snapshots__/fixture.test.ts.snap     | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap b/packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap
index 6eeb763c4117bd..85c03c5561179b 100644
--- a/packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap
+++ b/packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap
@@ -13,7 +13,7 @@ export const excludeSelf = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": ()
 export const customQueryString = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom\\")});
 export const customQueryObject = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true\\")});
 export const parent = /* #__PURE__ */ Object.assign({});
-export const rootMixedRelative = /* #__PURE__ */ Object.assign({\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url\\").then(m => m[\\"default\\"])});
+export const rootMixedRelative = /* #__PURE__ */ Object.assign({\\"/clientInjections.spec.ts\\": () => import(\\"../../clientInjections.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url\\").then(m => m[\\"default\\"])});
 export const cleverCwd1 = /* #__PURE__ */ Object.assign({\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")});
 export const cleverCwd2 = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"),\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\")});
 "
@@ -32,7 +32,7 @@ export const excludeSelf = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": ()
 export const customQueryString = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom&lang.ts\\")});
 export const customQueryObject = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true&lang.ts\\")});
 export const parent = /* #__PURE__ */ Object.assign({});
-export const rootMixedRelative = /* #__PURE__ */ Object.assign({\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url&lang.ts\\").then(m => m[\\"default\\"])});
+export const rootMixedRelative = /* #__PURE__ */ Object.assign({\\"/clientInjections.spec.ts\\": () => import(\\"../../clientInjections.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url&lang.ts\\").then(m => m[\\"default\\"])});
 export const cleverCwd1 = /* #__PURE__ */ Object.assign({\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")});
 export const cleverCwd2 = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"),\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\")});
 "

From 60c8d4b9a0eec582b4ba5a01993ae87f61ba9ce8 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Fri, 26 Aug 2022 16:16:15 -0500
Subject: [PATCH 36/40] test(client-inject): verify replaces template literal
 expression

---
 .../src/node/__tests__/plugins/clientInjections.spec.ts    | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/packages/vite/src/node/__tests__/plugins/clientInjections.spec.ts b/packages/vite/src/node/__tests__/plugins/clientInjections.spec.ts
index 2fb594b9da6bd1..1f989ddec07f09 100644
--- a/packages/vite/src/node/__tests__/plugins/clientInjections.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/clientInjections.spec.ts
@@ -36,6 +36,13 @@ describe('clientInjectionsPlugin', () => {
     )
   })
 
+  test('replaces process.env.NODE_ENV inside template literal expressions for non-SSR', async () => {
+    const { transform } = await createClientInjectionPluginTransform()
+    expect(await transform('let x = `${process.env.NODE_ENV}`;')).toBe(
+      'let x = `${"test"}`;'
+    )
+  })
+
   test('ignores process.env.NODE_ENV for SSR', async () => {
     const { transform: ssrTransform } =
       await createClientInjectionPluginTransform({

From e3dd331974fcded620b38d3ab94f82d995749678 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Thu, 1 Sep 2022 01:12:15 -0500
Subject: [PATCH 37/40] revert: "test(define): skip tests for
 'process.env.NODE_ENV' until #9829 fix"

This reverts commit bce6fe23b3b3ef925478b833220f89b9fe3b2765.
---
 playground/define/__tests__/define.spec.ts | 27 +++++++++++-----------
 1 file changed, 13 insertions(+), 14 deletions(-)

diff --git a/playground/define/__tests__/define.spec.ts b/playground/define/__tests__/define.spec.ts
index 4dcdf5f1edda5e..43e260715b5192 100644
--- a/playground/define/__tests__/define.spec.ts
+++ b/playground/define/__tests__/define.spec.ts
@@ -58,20 +58,19 @@ test('ignores constants in string literals', async () => {
       '.ignores-string-literals .globalThis-process-env-dot'
     )
   ).toBe('globalThis.process.env.')
-  // FIXME: Skip tests until vitejs/vite#9829 is fixed
-  // expect(
-  //   await page.textContent('.ignores-string-literals .process-env-NODE_ENV')
-  // ).toBe('process.env.NODE_ENV')
-  // expect(
-  //   await page.textContent(
-  //     '.ignores-string-literals .global-process-env-NODE_ENV'
-  //   )
-  // ).toBe('global.process.env.NODE_ENV')
-  // expect(
-  //   await page.textContent(
-  //     '.ignores-string-literals .globalThis-process-env-NODE_ENV'
-  //   )
-  // ).toBe('globalThis.process.env.NODE_ENV')
+  expect(
+    await page.textContent('.ignores-string-literals .process-env-NODE_ENV')
+  ).toBe('process.env.NODE_ENV')
+  expect(
+    await page.textContent(
+      '.ignores-string-literals .global-process-env-NODE_ENV'
+    )
+  ).toBe('global.process.env.NODE_ENV')
+  expect(
+    await page.textContent(
+      '.ignores-string-literals .globalThis-process-env-NODE_ENV'
+    )
+  ).toBe('globalThis.process.env.NODE_ENV')
   expect(
     await page.textContent(
       '.ignores-string-literals .__vite_process_env_NODE_ENV'

From 43d21c26b845a22825300959e1a6f62eb4f2d778 Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 6 Sep 2022 14:31:22 -0500
Subject: [PATCH 38/40] chore(define): remove workaround for vitest#1941

As of #9985, Vite is using Vitest 0.23.1, which fixed the issue.
---
 .../vite/src/node/__tests__/plugins/define.spec.ts  | 13 +++++--------
 packages/vite/src/node/plugins/define.ts            |  9 +++------
 playground/react/__tests__/react.spec.ts            |  4 +---
 playground/vue/__tests__/vue.spec.ts                |  4 +---
 4 files changed, 10 insertions(+), 20 deletions(-)

diff --git a/packages/vite/src/node/__tests__/plugins/define.spec.ts b/packages/vite/src/node/__tests__/plugins/define.spec.ts
index 6106d15377d6d7..f51f6ddeb65d6a 100644
--- a/packages/vite/src/node/__tests__/plugins/define.spec.ts
+++ b/packages/vite/src/node/__tests__/plugins/define.spec.ts
@@ -19,9 +19,6 @@ async function createDefinePluginTransform(
   }
 }
 
-// FIXME: Use string concatenation to workaround https://github.com/vitest-dev/vitest/issues/1941
-const importMetaEnv = 'import' + '.meta.env'
-
 describe('definePlugin', () => {
   test('replaces custom define', async () => {
     const transform = await createDefinePluginTransform({
@@ -35,12 +32,12 @@ describe('definePlugin', () => {
     )
   })
 
-  test(`replaces ${importMetaEnv}.SSR with false`, async () => {
+  test('replaces import.meta.env.SSR with false', async () => {
     const transform = await createDefinePluginTransform()
-    expect(await transform(`const isSSR = ${importMetaEnv}.SSR ;`)).toBe(
+    expect(await transform('const isSSR = import.meta.env.SSR ;')).toBe(
       'const isSSR = false ;'
     )
-    expect(await transform(`const isSSR = ${importMetaEnv}.SSR;`)).toBe(
+    expect(await transform('const isSSR = import.meta.env.SSR;')).toBe(
       'const isSSR = false;'
     )
   })
@@ -54,8 +51,8 @@ describe('definePlugin', () => {
     'global.process.env.NODE_ENV': '"test"',
     'globalThis.process.env.NODE_ENV': '"test"',
     __vite_process_env_NODE_ENV: '"test"',
-    [importMetaEnv + '.']: '({}).',
-    [importMetaEnv]:
+    'import.meta.env.': '({}).',
+    'import.meta.env':
       '{"BASE_URL":"/","MODE":"development","DEV":true,"PROD":false}',
     'import.meta.hot': 'false'
   }
diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index eee640e5890ab5..668419fb779272 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -45,15 +45,12 @@ export function definePlugin(config: ResolvedConfig): Plugin {
       SSR: !!config.build.ssr
     }
 
-    // FIXME: Use string concatenation to workaround https://github.com/vitest-dev/vitest/issues/1941
-    const importMetaEnv = 'import' + '.meta.env'
-
     for (const key in env) {
-      importMetaKeys[`${importMetaEnv}.${key}`] = JSON.stringify(env[key])
+      importMetaKeys[`import.meta.env.${key}`] = JSON.stringify(env[key])
     }
     Object.assign(importMetaFallbackKeys, {
-      [importMetaEnv + '.']: `({}).`,
-      [importMetaEnv]: JSON.stringify(config.env),
+      'import.meta.env.': `({}).`,
+      'import.meta.env': JSON.stringify(config.env),
       'import.meta.hot': `false`
     })
   }
diff --git a/playground/react/__tests__/react.spec.ts b/playground/react/__tests__/react.spec.ts
index e465e69f63ceda..054335a5adf33b 100644
--- a/playground/react/__tests__/react.spec.ts
+++ b/playground/react/__tests__/react.spec.ts
@@ -39,7 +39,5 @@ test.runIf(isServe)(
 )
 
 test('defined/reserved words are preserved in string literals', async () => {
-  expect(await page.textContent('.define-variable')).toBe(
-    'import' + '.meta.env' // FIXME: Use string concatenation to workaround https://github.com/vitest-dev/vitest/issues/1941
-  )
+  expect(await page.textContent('.define-variable')).toBe('import.meta.env')
 })
diff --git a/playground/vue/__tests__/vue.spec.ts b/playground/vue/__tests__/vue.spec.ts
index db7b2f0496d93e..7688e3d40c6907 100644
--- a/playground/vue/__tests__/vue.spec.ts
+++ b/playground/vue/__tests__/vue.spec.ts
@@ -266,8 +266,6 @@ describe('vue worker', () => {
 
 describe('defined/reserved words', () => {
   test('are preserved in string literals', async () => {
-    expect(await page.textContent('.define-variable')).toBe(
-      'import' + '.meta.env' // FIXME: Workaround Vite replacement of import\0.meta.env
-    )
+    expect(await page.textContent('.define-variable')).toBe('import.meta.env')
   })
 })

From 39bd627a4e9e066b9d0995b39ef5c4d88c477aee Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 6 Sep 2022 14:37:17 -0500
Subject: [PATCH 39/40] docs(define): update expected version

---
 docs/config/shared-options.md | 4 ++--
 docs/guide/env-and-mode.md    | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/docs/config/shared-options.md b/docs/config/shared-options.md
index 5a3ce523068cea..b5df6b38fb6583 100644
--- a/docs/config/shared-options.md
+++ b/docs/config/shared-options.md
@@ -39,14 +39,14 @@ Define global constant replacements. Entries will be defined as globals during d
 
 - Starting from `2.0.0-beta.70`, string values will be used as raw expressions, so if defining a string constant, it needs to be explicitly quoted (e.g. with `JSON.stringify`).
 
-- Starting from `3.1.0`, defined constants within string literals and comments are ignored. For example, `process.env.NODE_ENV` is not replaced in `console.log('mode is process.env.NODE_ENV') /* process.env.NODE_ENV */`.
+- Starting from `3.2.0`, defined constants within string literals and comments are ignored. For example, `process.env.NODE_ENV` is not replaced in `console.log('mode is process.env.NODE_ENV') /* process.env.NODE_ENV */`.
 
 - To be consistent with [esbuild behavior](https://esbuild.github.io/api/#define), expressions must either be a JSON object (null, boolean, number, string, array, or object) or a single identifier.
 
 - Replacements are performed only when the match isn't surrounded by other letters, numbers, `_` or `$`.
 
 ::: warning
-Because it's implemented as straightforward text replacements without any syntax analysis (pre Vite 3.1.0), we recommend using `define` for CONSTANTS only.
+Because it's implemented as straightforward text replacements without any syntax analysis (pre Vite 3.2.0), we recommend using `define` for CONSTANTS only.
 
 For example, `process.env.FOO` and `__APP_VERSION__` are good fits. But `process` or `global` should not be put into this option. Variables can be shimmed or polyfilled instead.
 :::
diff --git a/docs/guide/env-and-mode.md b/docs/guide/env-and-mode.md
index e243c25523ecc0..b9a3c639e22f37 100644
--- a/docs/guide/env-and-mode.md
+++ b/docs/guide/env-and-mode.md
@@ -18,7 +18,7 @@ Vite exposes env variables on the special **`import.meta.env`** object. Some bui
 
 During production, these env variables are **statically replaced**. It is therefore necessary to always reference them using the full static string. For example, dynamic key access like `import.meta.env[key]` will not work.
 
-Before version 3.1.0, Vite also replaces environment variables (and other [defined constants](/config/shared-options.html#define)) within string literals and comments. This could result in unintentional changes to your string literals that result in invalid JavaScript syntax, causing errors like `Missing ) after argument list`, `Missing semicolon`, or `Unexpected token`. For example, you'd see an error when `console.log("This is process.env.`<wbr>`NODE_ENV")` is transformed to `console.log("This is "development"")`.
+Before version 3.2.0, Vite also replaces environment variables (and other [defined constants](/config/shared-options.html#define)) within string literals and comments. This could result in unintentional changes to your string literals that result in invalid JavaScript syntax, causing errors like `Missing ) after argument list`, `Missing semicolon`, or `Unexpected token`. For example, you'd see an error when `console.log("This is process.env.`<wbr>`NODE_ENV")` is transformed to `console.log("This is "development"")`.
 
 There are ways to work around this string replacement behavior:
 

From 1df6fa4ea716c90d2d738767a533f8c6ad27963f Mon Sep 17 00:00:00 2001
From: Tony Trinh <tony19@gmail.com>
Date: Tue, 6 Sep 2022 16:59:26 -0500
Subject: [PATCH 40/40] test(util): verify replaceInCode ignores string
 literals/comments

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

diff --git a/packages/vite/src/node/__tests__/utils.spec.ts b/packages/vite/src/node/__tests__/utils.spec.ts
index b8228b82b51b8e..091a1b09239127 100644
--- a/packages/vite/src/node/__tests__/utils.spec.ts
+++ b/packages/vite/src/node/__tests__/utils.spec.ts
@@ -245,4 +245,16 @@ describe('replaceInCode', () => {
   test('returns null if no replacement', () => {
     expect(replaceInCode('let a = b;', /\d/g, {})).toBe(null)
   })
+
+  test('ignores string literals', () => {
+    expect(replaceInCode('let a1 = "1";', /\d/g, 'b')?.toString()).toBe(
+      'let ab = "1";'
+    )
+  })
+
+  test('ignores comments', () => {
+    expect(
+      replaceInCode('let a /* 1 */ = 1; // 1', /\d/g, 'b')?.toString()
+    ).toBe('let a /* 1 */ = b; // 1')
+  })
 })