AI & Agent Dev Bug Sandbox logo
AI & Agent Dev Bug Sandbox
Back to Radar

React Compiler + Turbopack: Browser Source Map `SourcesContent` Is The Compiler Output (Wrong Line Numbers) For Client→Client Imports

When React Compiler is enabled with Turbopack and production browser source maps, client components imported by other client components generate source maps where `sourcesContent` is the compiler output instead of the original source, causing incorrect line numbers and breaking devtools and error tracking tools.

highConfidence 85%Next.jsAffected V16.2.6Affected V16.3.0-Canary.40

Origin Analysis

Turbopack's source map generation for client-to-client imports incorrectly uses the React Compiler's transformed output as the `sourcesContent` instead of chaining the compiler's source map back to the original source file. This happens only when a client component imports another client component, indicating that the source map chain is not correctly applied in that specific module graph path.
1. Clone and install: git clone https://github.com/atkaiser/rc-sourcemap-repro && cd rc-sourcemap-repro && npm install 2. Run npm run build to build with React Compiler enabled. 3. Run npm run inspect to inspect the browser source map. Observe `sourcesContent` for `app/widget.tsx` is 27 lines with compiler runtime imports. 4. Run npm run build:no-rc to build with React Compiler disabled (REACT_COMPILER=false). 5. Run npm run inspect again. Now `sourcesContent` is 9 lines identical to the real file.

Fixing Code Block

Edge Case Audit

This fix forces `sourcesContent` to be read from disk, which may add I/O overhead during build and could fail if source files are virtual or generated. Additionally, it may mask legitimate source map transformations from other plugins. Rollback: remove the post-processing function and rely on the original Turbopack source map generation. Test with various transforms (Babel, SWC, custom loaders) to ensure no regressions.

Ecosystem Topology