facebook/react · error · Error

Cannot read Symbol exports. Only named exports are…

Error message

Cannot read Symbol exports. Only named exports are supported on a client module imported on the server.

What it means

The module proxy for a client module can only create references for named (string) exports, because the reference id is built as `moduleId + '#' + name` and the client looks exports up by name. Symbol-keyed exports cannot be represented, so reading any symbol property that is not an internal passthrough (like Symbol.toPrimitive or Symbol.toStringTag) throws with this restriction.

Solutions

  1. Import the specific named exports you need instead of using the namespace object.
  2. Keep iterable/duck-typed modules out of 'use client' files if the server must interact with them.
  3. In generic helpers, skip symbol probing for objects marked as client references ($$typeof check).

Example fix

// before (server component)
import * as icons from './icons.client';
const names = [...icons];

// after: explicit named imports only
import { Star, Heart } from './icons.client';
Defensive patterns

Strategy: type-guard

Validate before calling

// Skip symbol probes on client namespaces
function isClientModuleNamespace(obj) {
  return obj != null && obj.$$typeof === Symbol.for('react.client.reference');
}
if (!isClientModuleNamespace(mod)) {
  for (const k of mod) { /* symbol iteration ok */ }
}

Type guard

export function isClientModuleNamespace(value) {
  return value != null && typeof value === 'object' && value.$$typeof === Symbol.for('react.client.reference');
}

Prevention

When it happens

Trigger: On the server: accessing a symbol-keyed export of a 'use client' module — `mod[Symbol.iterator]`, spreading a namespace import (`{...mod}`), `for...of` over the namespace, or duck-typing probes like `mod[Symbol.asyncIterator]`.

Common situations: Iterating or spreading namespace imports of client modules in server components; generic libraries that feature-detect via well-known symbols (iterator, hasInstance) on values that turn out to be client module namespaces; logging utilities that symbolically inspect objects.

Related errors


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

Appendix: source

Thrown at packages/react-server-dom-unbundled/src/ReactFlightUnbundledReferences.js:291

          function then(resolve, reject: any) {
            // Expose to React.
            return Promise.resolve(resolve(proxy));
          } as any,
          // If this is not used as a Promise but is treated as a reference to a `.then`
          // export then we should treat it as a reference to that name.
          target.$$id + '#then',
          false,
        ));
        return then;
      } else {
        // Since typeof .then === 'function' is a feature test we'd continue recursing
        // indefinitely if we return a function. Instead, we return an object reference
        // if we check further.
        return undefined;
      }
  }
  if (typeof name === 'symbol') {
    throw new Error(
      'Cannot read Symbol exports. Only named exports are supported on a client module ' +
        'imported on the server.',
    );
  }
  let cachedReference = target[name];
  if (!cachedReference) {
    const reference: ClientReference<any> = registerClientReferenceImpl(
      function () {
        throw new Error(
          // eslint-disable-next-line react-internal/safe-string-coercion
          `Attempted to call ${String(name)}() from the server but ${String(
            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.`,
        );
      } as any,
      target.$$id + '#' + name,

View on GitHub (pinned to eafeac097b)