vercel/next.js · error · Error
Using Client Components is not allowed in this environment.
Error message
Using Client Components is not allowed in this environment.
What it means
`use-client-disallowed.ts` exports a `Proxy` whose `get` trap throws this `Error` on any property access. Next.js swaps in this module for `react` (or `'use client'` modules) in environments where Client Components are forbidden — notably when a Client Component is imported into a Server Component graph running in a context that cannot execute client modules (e.g. server-only RSC bundles, certain edge constraints).
Source
Thrown at packages/next/src/client/use-client-disallowed.ts:5
const error = new Proxy(
{},
{
get(_target) {
throw new Error(
'Using Client Components is not allowed in this environment.'
)
},
}
)
export default new Proxy(
{},
{
get: (_target, p) => {
if (p === '__esModule') return true
return error
},
}
)
View on GitHub (pinned to 0ae8c72462)
Solutions
- Ensure Client Components are only rendered as elements (`<ClientComponent />`) from Server Components, not by calling their hooks/functions directly.
- Move client-only logic behind a `'use client'` boundary and pass serializable props from the server.
- Audit third-party imports — if a dependency is client-only, wrap it in a Client Component.
Example fix
// before — Server Component imports client module directly
import { useThing } from './client-hook' // 'use client' module
export default function Page() { useThing() /* throws via Proxy */ }
// after — pass client logic into a Client Component
import ClientWidget from './ClientWidget' // 'use client'
export default function Page() {
return <ClientWidget initial={...} />
} Defensive patterns
Strategy: type-guard
Validate before calling
// Ensure client modules are only imported by client components. // Audit that no Server Component imports a 'use client' module's internals directly.
Type guard
// No runtime guard — the Proxy throws on access. Prevention is architectural: // keep 'use client' boundaries clean and pass serializable props.
Prevention
- Render Client Components as JSX elements from Server Components; do not call their hooks directly.
- Mark client-only utility modules with 'use client' and import them only from client files.
- Audit third-party dependencies for implicit client-only behavior before importing into server code.
When it happens
Trigger: Importing a module marked `'use client'` (or the `react` client entry) into a Server Component that is bundled for an environment disallowing client modules; the bundler remaps the import to this Proxy stub, and any property read triggers the throw.
Common situations: Importing a Client Component into a Server Component incorrectly; misconfigured `serverComponents` setup; a third-party library that is client-only being pulled into a server bundle; using `react` APIs that are client-only in an RSC.
Related errors
- `${name}` is only available in a Server Component.
- `catchError` can only be used in Client Components.
- `unstable_isUnrecognizedActionError` can only be used on the
- Attempted to call the default export of {server_module_path}
- Attempted to call {export_name}() from the server but {expor
AI-assisted analysis of vercel/next.js@0ae8c72462 (2026-08-06).
Data as JSON: /api/errors/baddfb4912fb3693.
Report an issue: GitHub.