Visitar URL original
fix(react): respect environment sourcemap option when `builder.shared… · vitejs/vite-plugin-react@82d35ab · GitHub
Skip to content

Commit 82d35ab

Browse files
authored
fix(react): respect environment sourcemap option when builder.sharedPlugins is enabled (#1439)
1 parent 397e847 commit 82d35ab

3 files changed

Lines changed: 71 additions & 34 deletions

File tree

‎packages/plugin-react/CHANGELOG.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@
66

77
Recoverable React Compiler diagnostics are no longer logged by default. Set `compiler.logDiagnostics` to `true` to log them through Vite. Fatal diagnostics are always logged and fail the transform.
88

9+
### Respect environment sourcemap option for React Compiler transform when `builder.sharedPlugins` is enabled ([#1439](https://github.com/vitejs/vite-plugin-react/pull/1439))
10+
11+
The React Compiler transform was using the top-level sourcemap option instead of the environment sourcemap option. This caused a problem when the experimental `builder.sharedPlugins` was enabled.
12+
913
## 6.1.0 (2026-08-19)
1014

1115
### Add experimental native React Compiler support ([#1419](https://github.com/vitejs/vite-plugin-react/pull/1419))

‎packages/plugin-react/src/index.ts‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -303,7 +303,6 @@ function createReactCompilerPlugin(
303303
reactOptions: Pick<Options, 'jsxRuntime' | 'jsxImportSource'>,
304304
isFastRefreshEnabled: () => boolean,
305305
): Plugin {
306-
let sourcemap = true
307306
let jsxDevelopment = false
308307
let compiler: typeof import('oxc-transform-react') | undefined
309308
const runtime =
@@ -339,7 +338,6 @@ function createReactCompilerPlugin(
339338
}
340339
},
341340
configResolved(config) {
342-
sourcemap = config.command !== 'build' || !!config.build.sourcemap
343341
jsxDevelopment = !config.isProduction
344342
},
345343
transform: {
@@ -368,7 +366,10 @@ function createReactCompilerPlugin(
368366
refresh: isClient && isFastRefreshEnabled(),
369367
},
370368
reactCompiler: shouldCompile ? reactCompilerOptions : false,
371-
sourcemap,
369+
sourcemap: this.environment
370+
? this.environment.config.command !== 'build' ||
371+
!!this.environment.config.build.sourcemap
372+
: true /* direct Rolldown case */,
372373
})
373374
const diagnostics = result.errors.map(
374375
(error) =>

‎packages/plugin-react/tests/reactCompiler.test.ts‎

Lines changed: 63 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import path from 'node:path'
22
import { type Plugin, rolldown } from 'rolldown'
3+
import { BuildEnvironment, type InlineConfig, resolveConfig } from 'vite'
34
import { describe, expect, test } from 'vitest'
45
import pluginReact, {
56
type Options,
@@ -89,25 +90,62 @@ describe('compiler option', () => {
8990
})
9091

9192
test('uses the native JSX transform for server environments', async () => {
92-
const output = await transformWithBuildConfig({}, false, 'server')
93+
const output = await transformWithBuildConfig(
94+
{},
95+
{
96+
build: { sourcemap: false },
97+
environments: { ssr: {} },
98+
},
99+
'ssr',
100+
)
93101

94-
expect(output.code).toContain('react/jsx-runtime')
102+
expect(output.code).toMatch(/react\/jsx(?:-dev)?-runtime/)
95103
expect(output.code).not.toContain('react/compiler-runtime')
96104
})
97105

98106
test('uses the Vite build sourcemap setting', async () => {
99-
const withoutSourcemap = await transformWithBuildConfig({}, false)
100-
expect(withoutSourcemap.code).toContain('react/jsx-runtime')
107+
const withoutSourcemap = await transformWithBuildConfig(
108+
{},
109+
{ build: { sourcemap: false } },
110+
)
111+
expect(withoutSourcemap.code).toMatch(/react\/jsx(?:-dev)?-runtime/)
101112
expect(withoutSourcemap.map).toBeFalsy()
102-
expect((await transformWithBuildConfig({}, true)).map).toBeTruthy()
113+
expect(
114+
(await transformWithBuildConfig({}, { build: { sourcemap: true } })).map,
115+
).toBeTruthy()
116+
})
117+
118+
test('uses the environment build sourcemap setting', async () => {
119+
expect(
120+
(
121+
await transformWithBuildConfig(
122+
{},
123+
{
124+
build: { sourcemap: true },
125+
environments: { client: { build: { sourcemap: false } } },
126+
},
127+
)
128+
).map,
129+
).toBeFalsy()
130+
expect(
131+
(
132+
await transformWithBuildConfig(
133+
{},
134+
{
135+
build: { sourcemap: false },
136+
environments: { client: { build: { sourcemap: true } } },
137+
},
138+
)
139+
).map,
140+
).toBeTruthy()
103141
})
104142

105143
test('logs recoverable diagnostics when enabled', async () => {
106144
const diagnostics: unknown[] = []
107145

108146
await transformWithBuildConfig(
109147
{ logDiagnostics: true },
110-
false,
148+
{},
111149
'client',
112150
`
113151
import { useState } from 'react'
@@ -129,12 +167,23 @@ describe('compiler option', () => {
129167

130168
async function transformWithBuildConfig(
131169
compiler: ReactCompilerOptions,
132-
buildSourcemap: boolean,
133-
consumer: 'client' | 'server' = 'client',
170+
inlineConfig: InlineConfig,
171+
environmentName = 'client',
134172
code: string = `export function App({ name }) { return <div>{name}</div> }`,
135173
onWarn?: (message: unknown) => void,
136174
) {
137-
const plugin = pluginReact({ compiler }).find(
175+
const config = await resolveConfig(
176+
{
177+
...inlineConfig,
178+
configFile: false,
179+
logLevel: 'silent',
180+
plugins: [pluginReact({ compiler })],
181+
},
182+
'build',
183+
'production',
184+
'production',
185+
)
186+
const plugin = config.plugins.find(
138187
(plugin) => plugin.name === 'vite:react-compiler',
139188
)!
140189
const context = {
@@ -144,33 +193,16 @@ async function transformWithBuildConfig(
144193
warn(message: unknown) {
145194
onWarn?.(message)
146195
},
147-
environment: { config: { consumer } },
148-
}
149-
150-
if (typeof plugin.config !== 'function')
151-
throw new Error('Missing config hook')
152-
await plugin.config.call(
153-
context as any,
154-
{},
155-
{ command: 'build', mode: 'production' },
156-
)
157-
158-
if (typeof plugin.configResolved !== 'function') {
159-
throw new Error('Missing configResolved hook')
196+
environment: new BuildEnvironment(environmentName, config),
160197
}
161-
await plugin.configResolved.call(
162-
context as any,
163-
{
164-
command: 'build',
165-
isProduction: true,
166-
build: { sourcemap: buildSourcemap },
167-
} as any,
168-
)
169198

170199
if (typeof plugin.transform !== 'object') {
171200
throw new Error('Missing transform hook')
172201
}
173-
return plugin.transform.handler.call(context as any, code, '/entry.tsx')
202+
return plugin.transform.handler.call(context as any, code, '/entry.tsx') as {
203+
code: string
204+
map: Record<string, unknown> | undefined
205+
}
174206
}
175207

176208
async function getViteReactConfig(

0 commit comments

Comments
 (0)