fix(react): sourcemap incorrect warning and classic runtime sourcemap

packages/plugin-react/src/index.ts

@@ -278,7 +278,8 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
         if (shouldSkip) {
           // Avoid parsing if no plugins exist.
           return {
-            code
+            code,
+            map: null
           }
         }
 

playground/react-sourcemap/App.jsx

@@ -0,0 +1,7 @@
+function App() {
+  return <div>foo</div>
+}
+
+console.log('App.jsx') // for sourcemap
+
+export default App

playground/react-sourcemap/__tests__/react-sourcemap.spec.ts

@@ -0,0 +1,7 @@
+import { isBuild, serverLogs } from '~utils'
+
+test.runIf(isBuild)('should not output sourcemap warning', () => {
+  serverLogs.forEach((log) => {
+    expect(log).not.toMatch('Sourcemap is likely to be incorrect')
+  })
+})

playground/react-sourcemap/index.html

@@ -0,0 +1,2 @@
+<div id="app"></div>
+<script type="module" src="main.jsx"></script>

playground/react-sourcemap/main.jsx

@@ -0,0 +1,9 @@
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import App from './App.jsx'
+
+ReactDOM.createRoot(document.getElementById('app')).render(
+  React.createElement(App)
+)
+
+console.log('main.jsx') // for sourcemap

playground/react-sourcemap/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "test-react-sourcemap",
+  "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:*"
+  }
+}

playground/react-sourcemap/vite.config.ts

@@ -0,0 +1,11 @@
+import react from '@vitejs/plugin-react'
+import type { UserConfig } from 'vite'
+
+const config: UserConfig = {
+  plugins: [react()],
+  build: {
+    sourcemap: true
+  }
+}
+
+export default config