async Client Component ⚛️ React

Error: async/await is not yet supported in Client Components, only Server Components.

A component marked "use client" was declared async.

Seen on: React

Meaning

Client components can’t be async functions. Fetch data in a Server Component and pass it down, or fetch inside useEffect/React Query in the client.

Common causes

  • "use client" file exporting an async component
  • Copying a server component into a client file

⚡ Quick fix

  1. Remove async and fetch in useEffect / a data library
  2. Or remove "use client" and keep it a Server Component

Detailed fix by platform

React

  1. export default async function Page() { const data = await getData(); return <ClientList data={data} />; }

How to diagnose

  1. File — "use client" + async?
  2. Data — Where should fetching happen?

🧠 Still stuck? Analyze your error

Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.