概要
vue3-google-loginは、vue3でのgoogleログイン実装用のライブラリですが、Nuxt 3にてpluginsで設定し使用した際、ローカルでサーバを起動時に表題のエラーが発生しました。
今回は原因と対処方法をメモ書きします。
前提
- 使用したNuxt.jsのバージョンは
3.12.4
です。 - 使用したvue3-google-loginのバージョンは
2.0.29
です。
原因・対処方法
vue3-google-loginのドキュメントNuxt 3の項にある通り、この記事を書いている2024年8月時点ではSSRをサポートしていません。ので、pluginsをクライアント側で読み込む必要があります。
対処としては上記のドキュメントにも書いてありますが、pluginsの設定をしているファイル名に.client
を付与します。Nuxt 3ではClient-only Nuxt 3 Vue pluginのstackoverflowの記事にある通り、ファイル名でpluginsのクライアント側での読み込みを制御することができます。
今回はvue3GoogleLogin.client.ts
という名前で、pluginsのファイルを設定すれば大丈夫です。