fix(env): compatible with env variables ended with unescaped $ (#12031)

packages/vite/src/node/env.ts

@@ -47,19 +47,9 @@ export function loadEnv(
     process.env.BROWSER_ARGS = parsed.BROWSER_ARGS
   }
 
-  try {
-    // let environment variables use each other
-    expand({ parsed })
-  } catch (e) {
-    // custom error handling until https://github.com/motdotla/dotenv-expand/issues/65 is fixed upstream
-    // check for message "TypeError: Cannot read properties of undefined (reading 'split')"
-    if (e.message.includes('split')) {
-      throw new Error(
-        'dotenv-expand failed to expand env vars. Maybe you need to escape `$`?',
-      )
-    }
-    throw e
-  }
+  // let environment variables use each other
+  // `expand` patched in patches/dotenv-expand@9.0.0.patch
+  expand({ parsed })
 
   // only keys that start with prefix are exposed to client
   for (const [key, value] of Object.entries(parsed)) {

patches/dotenv-expand@9.0.0.patch

@@ -1,8 +1,19 @@
 diff --git a/lib/main.js b/lib/main.js
-index c873cc77229d4cd0cf9de98ae0970b25d89f312f..ddf570558e985760efde52af37a41b56282d30a6 100644
+index c873cc77229d4cd0cf9de98ae0970b25d89f312f..901758c6b665d2935501404fc09c6abd94b7eb1e 100644
 --- a/lib/main.js
 +++ b/lib/main.js
-@@ -50,9 +50,10 @@ function expand (config) {
+@@ -17,6 +17,10 @@ function _interpolate (envValue, environment, config) {
+       replacePart = parts[0]
+       value = replacePart.replace('\\$', '$')
+     } else {
++      // PATCH: compatible with env variables ended with unescaped $
++      if(!parts[2]) {
++        return newEnv
++      }
+       const keyParts = parts[2].split(':-')
+       const key = keyParts[0]
+       replacePart = parts[0].substring(prefix.length)
+@@ -50,9 +54,10 @@ function expand (config) {
      config.parsed[configKey] = _interpolate(value, environment, config)
    }
 

playground/env/.env

@@ -2,4 +2,10 @@ VITE_CUSTOM_ENV_VARIABLE=1
 CUSTOM_PREFIX_ENV_VARIABLE=1
 VITE_EFFECTIVE_MODE_FILE_NAME=.env
 VITE_BOOL=true
-VITE_EXPAND=$EXPAND
+VITE_EXPAND_A=$EXPAND
+VITE_EXPAND_B=$DEPEND_ENV
+VITE_ESCAPE_A=escape\$
+VITE_ESCAPE_B=escape$
+IRRELEVANT_ENV=$DEPEND_ENV
+IRRELEVANT_ESCAPE_ENV=irrelevant$
+DEPEND_ENV=depend

playground/env/__tests__/env.spec.ts

@@ -46,19 +46,29 @@ test('NODE_ENV', async () => {
 })
 
 test('expand', async () => {
-  expect(await page.textContent('.expand')).toBe('expand')
+  expect(await page.textContent('.expand-a')).toBe('expand')
+  expect(await page.textContent('.expand-b')).toBe('depend')
 })
 
 test('ssr', async () => {
   expect(await page.textContent('.ssr')).toBe('false')
 })
 
 test('env object', async () => {
-  const envText = await page.textContent('.env-object')
-  expect(JSON.parse(envText)).toMatchObject({
+  const env = JSON.parse(await page.textContent('.env-object'))
+  expect(env).not.toHaveProperty([
+    'DEPEND_ENV',
+    'IRRELEVANT_ENV',
+    'IRRELEVANT_ESCAPE_ENV',
+  ])
+  expect(env).toMatchObject({
     VITE_EFFECTIVE_MODE_FILE_NAME: `.env.${mode}`,
     CUSTOM_PREFIX_ENV_VARIABLE: '1',
     VITE_CUSTOM_ENV_VARIABLE: '1',
+    VITE_EXPAND_A: 'expand',
+    VITE_EXPAND_B: 'depend',
+    VITE_ESCAPE_A: 'escape$',
+    VITE_ESCAPE_B: 'escape$',
     BASE_URL: '/env/',
     VITE_BOOL: true,
     SSR: false,

playground/env/index.html

@@ -14,7 +14,8 @@ <h1>Environment Variables</h1>
 <p>import.meta.env.VITE_INLINE: <code class="inline"></code></p>
 <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.VITE_EXPAND: <code class="expand"></code></p>
+<p>import.meta.env.VITE_EXPAND_A: <code class="expand-a"></code></p>
+<p>import.meta.env.VITE_EXPAND_B: <code class="expand-b"></code></p>
 <p>import.meta.env.SSR: <code class="ssr"></code></p>
 <p>import.meta.env: <span class="pre env-object"></span></p>
 <p>import.meta.url: <span class="pre url"></span></p>
@@ -32,7 +33,8 @@ <h1>Environment Variables</h1>
   text('.ssr', import.meta.env.SSR)
   text('.node-env', process.env.NODE_ENV)
   text('.env-object', JSON.stringify(import.meta.env, null, 2))
-  text('.expand', import.meta.env.VITE_EXPAND)
+  text('.expand-a', import.meta.env.VITE_EXPAND_A)
+  text('.expand-b', import.meta.env.VITE_EXPAND_B)
 
   function text(el, text) {
     document.querySelector(el).textContent = text