# localStorage is not defined に遭遇した時の対応
ReferenceError
localStorage is not defined
spa で作ったプログラムを universal に切り替えて SSR で HP 速く表示することを目指しました。
SPA モードでは問題なく動いていたプログラムが localStorage is not defined エラー
localstorage はブラウザ側しかないのに、サーバーレンダリングされたことが原因 はわかるけど
SPA に切り替えてれば、動くこともわかるけど
SSR 使いたい! SSR 使いたいから SPA からわざわざ切り替えようとしているから
# window document が undefined
これは、サーバーサイドのレンダリングに起因します。 クライアントサイドでのみリソースをインポートしたい時は process.client 変数を使用する必要があります。
process.clientで if 判断
if (process.client) { require('external_library') }
# ssr サポートしていない plugin 使ってないか?
nuxt.config.js チェック
export default {
plugins: [
{ src: "~/plugins/both-sides.js" },
{ src: "~/plugins/client-only.js", mode: "client" },
{ src: "~/plugins/server-only.js", mode: "server" },
],
};
SSR したくないプラグインはmode:'client'追加 (Nuxt.js 2.4 以降)
ssr:false は次のメジャーリリースでは非推奨に