window や localStorage がない
ReferenceError: window is not defined ReferenceError: localStorage is not defined
ひとことで言うと
「ブラウザにしかないもの(window・document・localStorage)を、サーバーの上で使おうとしました」という意味です。Next.js などでよく出ます。
よくある原因
- コンポーネントの一番上で、すぐ localStorage を読んでいる
- ブラウザ専用の部品(地図・グラフなど)を、サーバーでも読み込んでいる
自分で確かめること
- エラーの行が、useEffect の外にあるか見る
たいていは、こうすると直ります
localStorage などは useEffect の中で使うか、typeof window !== "undefined" で確かめてから使います。
AIへの伝え方
下の文をコピーして、ChatGPT・Claude・Cursor などに貼り付けてください。トップで貼り付けたエラー文があれば、自動でそれに入れかわります。
次のエラーが出て困っています。プログラミング初心者にもわかるように、原因と直し方を教えてください。必要なら、直したコードも全部見せてください。 【エラー】 ReferenceError: window is not defined ReferenceError: localStorage is not defined 【やったこと】 (ここに、エラーが出る前にしたことを書く。例:npm run dev を実行した) 【参考】 このエラーは「window や localStorage がない」というもので、よくある原因は次のとおりです。 ・コンポーネントの一番上で、すぐ localStorage を読んでいる ・ブラウザ専用の部品(地図・グラフなど)を、サーバーでも読み込んでいる どれに当てはまるかを確かめる方法も教えてください。