0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【Nuxt 3】vue3-google-loginをpluginsで使用時に「vue3-google-login cannot be executed on the server side」のエラーが発生

Posted at

概要

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のファイルを設定すれば大丈夫です。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?