facebook/react · error · Error

Attempted to call ${name}() from the server but ${name} is o

Error message

Attempted to call ${name}() from the server but ${name} is on the client. It's not possible to invoke a client function from the server, it can only be rendered as a Component or passed to props of a Client Component.

What it means

The named-export twin of the default-export guard: while rewriting a client-reference module, the RSC ESM server loader wraps each named export in registerClientReference(function () { throw ... }). Calling any named export of a client module from server code fires this message at the call site, since client functions can only execute in the browser — server code may render them as components or pass them as props.

Source

Thrown at packages/react-server-dom-esm/src/ReactFlightESMNodeLoader.js:607

  for (let i = 0; i < names.length; i++) {
    const name = names[i];
    if (name === 'default') {
      newSrc += 'export default ';
      newSrc += 'registerClientReference(function() {';
      newSrc +=
        'throw new Error(' +
        JSON.stringify(
          `Attempted to call the default export of ${url} from the server ` +
            `but it's on the client. It's not possible to invoke a client function from ` +
            `the server, it can only be rendered as a Component or passed to props of a ` +
            `Client Component.`,
        ) +
        ');';
    } else {
      newSrc += 'export const ' + name + ' = ';
      newSrc += 'registerClientReference(function() {';
      newSrc +=
        'throw new Error(' +
        JSON.stringify(
          `Attempted to call ${name}() from the server but ${name} is on the client. ` +
            `It's not possible to invoke a client function from the server, it can ` +
            `only be rendered as a Component or passed to props of a Client Component.`,
        ) +
        ');';
    }
    newSrc += '},';
    newSrc += JSON.stringify(url) + ',';
    newSrc += JSON.stringify(name) + ');\n';
  }

  // TODO: Generate source maps for Client Reference functions so they can point to their
  // original locations.
  return newSrc;
}

async function loadClientImport(

View on GitHub (pinned to eafeac097b)

Solutions

1. Move the called function out of the 'use client' module into a shared server-safe module
2. Keep it on the client but don't invoke it server-side: render the exporting component or pass the function as a prop
3. If the function must run server-side, create a 'use server' action and call that instead

Example fix

// before
import {validate} from './form-utils.js'; // 'use client' module
if (!validate(user)) return null; // throws

// after
import {validate} from '../shared/validation.js'; // no directive
if (!validate(user)) return null;

const isClientReference = (v: any) =>
  v != null && v.$$typeof === Symbol.for('react.client.reference');
if (isClientReference(validate)) {
  // don't call: move validate to a shared module or render/pass instead
}

function isClientReference(value: unknown): boolean {
  return (
    typeof value === 'object' &&
    value !== null &&
    (value as any).$$typeof === Symbol.for('react.client.reference')
  );
}

try {
  const ok = validate(input);
} catch (e) {
  if (e instanceof Error && /^Attempted to call \S+\(\) from the server/.test(e.message)) {
    // client function invoked on server: relocate it to a shared module
  } else throw e;
}

When it happens

Trigger: Server code doing `import {validate} from './client-lib.js'` (module under 'use client') followed by validate(input); helper/validation functions exported from a client boundary file and invoked during RSC rendering or inside a server action module.

Common situations: Barrel files in client boundaries exporting both components and utility functions that server code tries to reuse; incremental RSC migrations where a previously shared util got a 'use client' directive; copy-pasting client logic into server components.

Related errors

• Attempted to call the default export of ${url} from the serv
• Cannot await or return from a thenable. You cannot await a c
• Cannot access ${expression} on the server. You cannot dot in
• Cannot assign to a client module from a server module.
• Attempted to call ${String(name)}() from the server but ${St

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