fix(react): $RefreshSig$ is not defined with NODE_ENV=production vite dev (#1283)

Author: sapphi-red

packages/plugin-react/CHANGELOG.md

@@ -2,6 +2,11 @@
 
 ## Unreleased
 
+### Fixed `$RefreshSig$ is not defined` error when running `vite dev` with `NODE_ENV=production`
+
+When running `vite dev` with `NODE_ENV=production`, the app errored with `$RefreshSig$ is not defined`.
+This error is now fixed.
+
 ## 6.0.3 (2026-06-23)
 
 ## 6.0.2 (2026-05-14)

packages/plugin-react/src/index.ts

@@ -12,7 +12,7 @@ import {
   silenceUseClientWarning,
   virtualPreamblePlugin,
 } from '@vitejs/react-common'
-import type { Plugin } from 'vite'
+import type { Plugin, ServerOptions } from 'vite'
 import { reactRefreshWrapperPlugin } from 'vite/internal'
 import { reactCompilerPreset } from './reactCompilerPreset'
 
@@ -66,11 +66,18 @@ export default function viteReact(opts: Options = {}): Plugin[] {
   const jsxImportDevRuntime = `${jsxImportSource}/jsx-dev-runtime`
 
   let runningInVite = false
-  let isProduction = true
   let skipFastRefresh = true
   let base: string
   let isBundledDev = false
 
+  function calculateSkipFastRefresh(
+    isProduction: boolean,
+    command: 'serve' | 'build',
+    hmr: ServerOptions['hmr'],
+  ) {
+    return isProduction || command === 'build' || hmr === false
+  }
+
   const viteBabel: Plugin = {
     name: 'vite:react-babel',
     enforce: 'pre',
@@ -109,11 +116,18 @@ export default function viteReact(opts: Options = {}): Plugin[] {
       if (config.experimental.bundledDev) {
         isBundledDev = true
       }
-      isProduction = config.isProduction
-      skipFastRefresh =
-        isProduction ||
-        config.command === 'build' ||
-        config.server.hmr === false
+      if (
+        skipFastRefresh !==
+        calculateSkipFastRefresh(
+          config.isProduction,
+          config.command,
+          config.server?.hmr,
+        )
+      ) {
+        this.warn(
+          `NODE_ENV (${JSON.stringify(process.env.NODE_ENV)}) or server.hmr was changed by plugins after the react plugin read the config. This may cause unexpected behavior.`,
+        )
+      }
     },
     options(options) {
       if (!runningInVite) {
@@ -148,8 +162,14 @@ export default function viteReact(opts: Options = {}): Plugin[] {
   const viteConfigPost: Plugin = {
     name: 'vite:react:config-post',
     enforce: 'post',
-    config(userConfig) {
-      if (userConfig.server?.hmr === false) {
+    config(userConfig, { command }) {
+      skipFastRefresh = calculateSkipFastRefresh(
+        // same with ResolvedConfig.isProduction
+        process.env.NODE_ENV === 'production',
+        command,
+        userConfig.server?.hmr,
+      )
+      if (skipFastRefresh) {
         return {
           oxc: {
             jsx: {

playground/node-env-production/App.jsx

@@ -0,0 +1,10 @@
+import { useState } from 'react'
+
+export default function App() {
+  const [count, setCount] = useState(0)
+  return (
+    <button onClick={() => setCount((count) => count + 1)}>
+      count is {count}
+    </button>
+  )
+}

playground/node-env-production/__tests__/node-env-production.spec.ts

@@ -0,0 +1,8 @@
+import { expect, test } from 'vitest'
+import { page } from '~utils'
+
+test('app works with NODE_ENV=production', async () => {
+  expect(await page.textContent('button')).toMatch('count is 0')
+  await page.click('button')
+  expect(await page.textContent('button')).toMatch('count is 1')
+})

playground/node-env-production/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>

playground/node-env-production/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "@vitejs/test-react-node-env-production",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "debug": "node --inspect-brk vite",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^19.2.7",
+    "react-dom": "^19.2.7"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-react": "workspace:*"
+  }
+}

playground/node-env-production/vite.config.ts

@@ -0,0 +1,15 @@
+import react from '@vitejs/plugin-react'
+import type { UserConfig } from 'vite'
+
+process.env.NODE_ENV = 'production'
+
+const config: UserConfig = {
+  server: { port: 8911 /* Should be unique */ },
+  plugins: [react()],
+  build: {
+    // to make tests faster
+    minify: false,
+  },
+}
+
+export default config