Error: Only plain objects, and a few built-ins, can be passed to Client Components from Server Components.

Next.js · updated 2026-11-03

Thrown when props crossing the server-to-client boundary can't be serialized. The message names the value, for example 'Classes or null prototypes are not supported', and points at the prop.

 ⨯ Error: Only plain objects, and a few built-ins, can be passed to Client Components from Server Components. Classes or null prototypes are not supported.
  <OrderTable orders={[{id: ..., total: Decimal}, ...]}>
                      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    at stringify (<anonymous>)

Quick fix

Turn the value into plain data on the server before passing it: numbers or strings for Decimal and BigInt, ISO strings or numbers where you need full control over dates, arrays or objects for Map and Set, and only the fields the component needs from ORM rows.

Find the prop in the message and look at what type it holds.
Map ORM results to plain objects with just the fields the Client Component uses.
Convert Decimal to a string (or number if precision allows) and BigInt to a string.
Convert Map to Object.fromEntries(map) and Set to an array.

typescript

// app/orders/page.tsx (Server Component)
const rows = await db.order.findMany({ where: { userId } });

const orders = rows.map((o) => ({
  id: o.id,
  total: o.total.toString(),      // Decimal -> string
  createdAt: o.createdAt.toISOString(),
  status: o.status,
}));

return <OrderTable orders={orders} />;

Why it happens

ORM or database objects

Rows from some ORMs carry class instances or special number types (Prisma Decimal, BigInt columns). They look like plain objects in a console.log but are not serializable as props.

Class instances you created

A domain object built with new Order(...) keeps its prototype and methods. Only its data can cross to the client, so spread or map it to a plain object first.

Functions or values nested inside an object

A config object with a formatter function, or a Symbol key, fails the same way even when the top-level prop is an object.

Other fixes

Passing less data is often the better fix: a Client Component that only needs ids and labels should not receive whole rows.
Dates, Maps, Sets, BigInt and typed arrays are among the built-ins React can serialize, but converting dates to strings keeps formatting under your control.

Same error, other wording

Error: Only plain objects, and a few built-ins, can be passed to Client Components from Server Components. Classes or null prototypes are not supported.
Warning: Only plain objects can be passed to Client Components from Server Components. Decimal objects are not supported.

Let your coding agent catch the next one

Runheed records this error in production with the stack trace, the breadcrumbs before it and the agent session that shipped the code, and serves it to Claude Code, Cursor or any MCP client. With it connected, you can ask:

> Find the 'Only plain objects can be passed to Client Components' errors, show me which prop and type caused each, and map the data to plain objects with only the fields the client component uses.

Plans from $29/mo See what your agent reads See the setupCancel any time from the billing portal