Error AtlasError Documentation and Resolution

Next.js client component cannot be async

No async Client Component

Next.js detected a Client Component declared as an async function, which is unsupported because React Client Components cannot be async.

No async Client Componentrendering
No async Client Component
  • A file marked with use client declares its component as async.
  • Data fetching logic was moved into a Client Component using async and await directly.
  • A shared component was turned into a client component without refactoring async behavior.
  1. Convert the component to a Server Component if async rendering is required.
  2. Remove the async keyword and fetch client-side with hooks or supported libraries.
  3. Pass a promise through context and resolve it with the use API where appropriate.
Next.js Docs: No async Client Component
Next.js No async Client Component: causes and fixes | Error Atlas