ReferenceError: window is not defined

  • Next.js
  • React

What it means

Code that only works in a browser ran on the server, where there is no window, document or localStorage. In Next.js, components render on the server first.

Why it happens

  • Reading window, document or localStorage at the top of a component or module.
  • A library that touches the browser as soon as it is imported.

How to fix it

  1. Read browser values inside an effect, which only runs in the browser.
  2. Mark the component with 'use client' and still read browser values in an effect.
  3. Load browser-only libraries with a dynamic import that skips the server (ssr: false).

Let your AI find the cause

Paste this into Claude Code, Cursor, Lovable or whichever AI built your app. It looks first and changes nothing until you have read the answer.

My Next.js app fails with 'window is not defined' (or document / localStorage). Without changing anything yet, find every place that reads window, document or localStorage, and tell me which ones run during server rendering.