facebook/react · error · Error

react-dom/profiling is not supported in React Server Compone

Error message

react-dom/profiling is not supported in React Server Components.

What it means

react-dom/profiling is a browser-only build of react-dom that adds performance profiling instrumentation. Under the react-server export condition the package resolves to a stub whose entire module body is a single throw, because profiling hooks are meaningless in a Server Components bundle that never runs client rendering code. Any import of it inside a React Server Components module graph fails at import time, before any application code runs.

Source

Thrown at packages/react-dom/npm/profiling.react-server.js:3

'use strict';

throw new Error(
  'react-dom/profiling is not supported in React Server Components.'
);

View on GitHub (pinned to eafeac097b)

Solutions

Add "use client" to (or move the profiling import into) a client-only module so the server graph never evaluates it
Load it lazily from the browser only, e.g. a dynamic import inside useEffect, so the react-server graph never sees the specifier
Fix bundler/Jest config so the react-server condition applies only to files compiled for the server-components graph
Gate the import behind a runtime environment check and skip it on the server

Example fix

// before (shared/utils.js — also imported by a Server Component)
import 'react-dom/profiling';

// after (ProfilingClient.js)
'use client';
import 'react-dom/profiling';
export default function ProfilingClient() { /* ... */ }

Defensive patterns

Strategy: try-catch

Validate before calling

// profiling is client-only; never let the server graph see the specifier
const isBrowser = typeof window !== 'undefined';
if (isBrowser) {
  const profiling = await import('react-dom/profiling');
}

Try / catch

let profilingApi = null;
if (typeof window !== 'undefined') {
  try {
    profilingApi = await import('react-dom/profiling');
  } catch (e) {
    console.error('react-dom/profiling unavailable in this bundle', e);
  }
}

Prevention

Keep every react-dom/profiling import inside modules marked "use client"
Scope react-server resolve conditions to server-components directories only
Audit component-library entry points for react-dom subpath imports before using them in RSC apps

When it happens

Trigger: Any import of 'react-dom/profiling' (direct, or transitively via a shared utility or component library) from a file evaluated under the react-server condition: a Server Component in Next.js App Router, a *.server.js file, or a bundler/Jest config that applies resolve.conditions ['react-server'] too broadly.

Common situations: A component library that imports react-dom/profiling in its published entry gets pulled into a Server Component; Jest moduleNameMapper aliasing react-dom to the profiling build for all environments including server tests; migrating shared modules to RSC while keeping old profiling imports.

Related errors

AI-assisted analysis of facebook/react@eafeac097b (2026-08-21). Data as JSON: /api/errors/f3fa890064eaae65. Report an issue: GitHub.