diff --git a/packages/plugin-react/src/index.ts b/packages/plugin-react/src/index.ts
index ad54bb909a593b..f8aa1097cc037d 100644
--- a/packages/plugin-react/src/index.ts
+++ b/packages/plugin-react/src/index.ts
@@ -1,6 +1,7 @@
+import path from 'node:path'
 import type { ParserOptions, TransformOptions, types as t } from '@babel/core'
 import * as babel from '@babel/core'
-import { createFilter } from 'vite'
+import { createFilter, loadEnv, normalizePath, resolveEnvPrefix } from 'vite'
 import type { Plugin, PluginOption, ResolvedConfig } from 'vite'
 import MagicString from 'magic-string'
 import type { SourceMap } from 'magic-string'
@@ -118,8 +119,17 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
   const viteBabel: Plugin = {
     name: 'vite:react-babel',
     enforce: 'pre',
-    config(_, { mode }) {
-      // Copied from https://github.com/vitejs/vite/blob/4e9bdd4fb3654a9d43917e1cb682d3d2bad25115/packages/vite/src/node/config.ts#L488-L490
+    config(userConfig, { mode }) {
+      // Copied from https://github.com/vitejs/vite/blob/4e9bdd4fb3654a9d43917e1cb682d3d2bad25115/packages/vite/src/node/config.ts#L477-L494
+
+      const resolvedRoot = normalizePath(
+        userConfig.root ? path.resolve(userConfig.root) : process.cwd()
+      )
+      const envDir = userConfig.envDir
+        ? normalizePath(path.resolve(resolvedRoot, userConfig.envDir))
+        : resolvedRoot
+      loadEnv(mode, envDir, resolveEnvPrefix(userConfig))
+
       const isProduction =
         (process.env.NODE_ENV || process.env.VITE_USER_NODE_ENV || mode) ===
         'production'
diff --git a/playground/react-env/.env.staging b/playground/react-env/.env.staging
new file mode 100644
index 00000000000000..cbde1ccac505b4
--- /dev/null
+++ b/playground/react-env/.env.staging
@@ -0,0 +1 @@
+NODE_ENV=production
diff --git a/playground/react-env/App.jsx b/playground/react-env/App.jsx
new file mode 100644
index 00000000000000..216b2989b5106f
--- /dev/null
+++ b/playground/react-env/App.jsx
@@ -0,0 +1,14 @@
+import { useState } from 'react'
+
+function App() {
+  const [count, setCount] = useState(0)
+  return (
+    <div className="App">
+      <header className="App-header">
+        <h1 id="title">Hello Vite + React</h1>
+      </header>
+    </div>
+  )
+}
+
+export default App
diff --git a/playground/react-env/__tests__/react.spec.ts b/playground/react-env/__tests__/react.spec.ts
new file mode 100644
index 00000000000000..96c2945faeb13b
--- /dev/null
+++ b/playground/react-env/__tests__/react.spec.ts
@@ -0,0 +1,10 @@
+import { expect, test } from 'vitest'
+import { page } from '~utils'
+
+test('should work', async () => {
+  expect(
+    await page.textContent('h1', {
+      timeout: 100
+    })
+  ).toMatch('Hello Vite + React')
+})
diff --git a/playground/react-env/index.html b/playground/react-env/index.html
new file mode 100644
index 00000000000000..f0015ceb9829a3
--- /dev/null
+++ b/playground/react-env/index.html
@@ -0,0 +1,10 @@
+<div id="app"></div>
+<script type="module">
+  import React from 'react'
+  import ReactDOM from 'react-dom/client'
+  import App from './App.jsx'
+
+  ReactDOM.createRoot(document.getElementById('app')).render(
+    React.createElement(App)
+  )
+</script>
diff --git a/playground/react-env/package.json b/playground/react-env/package.json
new file mode 100644
index 00000000000000..059d3ba9930f87
--- /dev/null
+++ b/playground/react-env/package.json
@@ -0,0 +1,18 @@
+{
+  "name": "test-react-env",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "debug": "node --inspect-brk ../../packages/vite/bin/vite",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-react": "workspace:*"
+  }
+}
diff --git a/playground/react-env/vite.config.ts b/playground/react-env/vite.config.ts
new file mode 100644
index 00000000000000..4c1003b0e4687a
--- /dev/null
+++ b/playground/react-env/vite.config.ts
@@ -0,0 +1,16 @@
+import react from '@vitejs/plugin-react'
+import type { UserConfig } from 'vite'
+
+// Overriding the NODE_ENV set by vitest
+process.env.NODE_ENV = ''
+
+const config: UserConfig = {
+  plugins: [react()],
+  mode: 'staging',
+  build: {
+    // to make tests faster
+    minify: false
+  }
+}
+
+export default config
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a7f8770e4973ee..2449e7b9326542 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -877,6 +877,17 @@ importers:
       '@emotion/babel-plugin': 11.10.5
       '@vitejs/plugin-react': link:../../packages/plugin-react
 
+  playground/react-env:
+    specifiers:
+      '@vitejs/plugin-react': workspace:*
+      react: ^18.2.0
+      react-dom: ^18.2.0
+    dependencies:
+      react: 18.2.0
+      react-dom: 18.2.0_react@18.2.0
+    devDependencies:
+      '@vitejs/plugin-react': link:../../packages/plugin-react
+
   playground/react-sourcemap:
     specifiers:
       '@vitejs/plugin-react': workspace:*