# Next.js: ReferenceError: window is not defined (server-side rendering)

**Code:** `ReferenceError: window is not defined` · **Category:** Next.js · **Seen on:** Next.js, React

Code touching the browser's `window` ran on the server during SSR/build, where it doesn't exist.

## Meaning

Guard with `typeof window !== 'undefined'`, move the access into `useEffect` (client only), or load the browser-only component with `next/dynamic` and `ssr: false`. Third-party libs that read `window` at import time need dynamic import.

## Common causes

- `window.innerWidth`/`localStorage` at module or render time
- Library accessing window on import (charts, editors, maps)
- Server Component using browser API
- Top-level `window` access in utility files
- Pre-rendering at build time

## Quick fix

1. `useEffect(() => { /* window usage */ }, [])`
2. `const Map = dynamic(() => import('./Map'), { ssr: false })` in a Client Component
3. Guard: `typeof window !== "undefined"`

## Detailed fix by platform

### Next.js

1. `"use client"; const Chart = dynamic(() => import("react-apexcharts"), { ssr: false });`

## How to diagnose

1. **Where** — Render or import time?
2. **Library** — Browser-only?
3. **Component** — Client or server?

---
Source: [WhatIsMyError](https://whatismyerror.com/errors/nextjs/window-is-not-defined-ssr)
