[Next.js] window, sessionStorage, localStorageなどが使用できない原因
概要
Next.jsでwindowなどブラウザオブジェクトにアクセスするとReferenceErrorとなってしまう。
console.log(window)
// ReferenceError: window is not definedこれはデフォルトでサーバサイドレンダリングが有効になっているからであり、if文でブラウザオブジェクトが存在するかどうかを判定することでエラーを回避することができる。
if (typeof window !== 'undefined') {
console.log(window)
}if文ではなく、システム全体やコンポーネント単位で無効にする方法は以下の記事にまとめてあります。
