# Error: 'metadata' is not a valid export in a Client Component. Use generateMetadata in a Server Component instead.

- **ID:** `nextjs/invalid-metadata-export-client-component`
- **Domain:** nextjs
- **Category:** config_error
- **Verification:** ai_generated
- **Fix Rate:** 95%

## Root Cause

Next.js App Router requires metadata to be defined via the 'metadata' object or 'generateMetadata' function in Server Components only. Client Components cannot export metadata because they run on the browser.

## Version Compatibility

| Version | Status | Introduced | Deprecated |
|---------|--------|------------|------------|
| 13.4.0 | active | — | — |
| 13.5.0 | active | — | — |
| 14.0.0 | active | — | — |
| 14.1.0 | active | — | — |
| 15.0.0 | active | — | — |

## Workarounds

1. **Remove the 'use client' directive from the page/layout file. If you need client-side interactivity, split the file: keep the metadata export in the server component and move interactive parts to a separate client child component. Example: // page.tsx (Server Component) export const metadata = { title: 'My Page' }; export default function Page() { return <ClientComponent />; }** (95% success)
   ```
   Remove the 'use client' directive from the page/layout file. If you need client-side interactivity, split the file: keep the metadata export in the server component and move interactive parts to a separate client child component. Example: // page.tsx (Server Component) export const metadata = { title: 'My Page' }; export default function Page() { return <ClientComponent />; }
   ```
2. **Use generateMetadata function in a Server Component wrapper that fetches data and passes it to a Client Component.** (90% success)
   ```
   Use generateMetadata function in a Server Component wrapper that fetches data and passes it to a Client Component.
   ```

## Dead Ends

- **Moving the metadata export inside a 'use client' component but wrapping it with a HOC** — The 'use client' directive marks the entire file as client-side. Any metadata export is still invalid regardless of wrapping. (100% fail)
- **Trying to import metadata from a server component into a client component** — Metadata is a static export that must be defined in the page/layout file itself; importing it doesn't work because the client component cannot re-export it. (90% fail)