Next.js
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.
Error AtlasError Documentation and ResolutionObserved message
No async Client Component
Why it happens
- 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.
How to fix it
- Convert the component to a Server Component if async rendering is required.
- Remove the async keyword and fetch client-side with hooks or supported libraries.
- Pass a promise through context and resolve it with the use API where appropriate.
Official reference
Next.js Docs: No async Client ComponentRelated errors
Explore more