Nuxt.jsの@nuxtjs/google-analyticsをGA4に移行してみた

Nuxt.js（2系）のプロジェクトで@nuxtjs/google-analyticsのモジュールを使って既存のGoogleAnalyticsを利用していました。
この度GA4に移行したので手順をメモして起きます。

モジュールの変更

今まで使用していた@nuxtjs/google-analyticsは削除します。

yarn remove @nuxtjs/google-analytics

新たに@nuxtjs/google-gtagを追加します。

yarn add @nuxtjs/google-gtag

nuxt.config.jsの変更

モジュールの変更に伴いnuxt.config.jsの設定を変更します。

  buildModules: [
    // '@nuxtjs/google-analytics',　消去
    '@nuxtjs/google-gtag' // 追加
  ],

  /* 追加　*/
  'google-gtag': {
    id: process.env.GOOGLE_ANALYTICS_ID,
    debug: true
  },
  /*
  古いアナリティクスの設定の為消去
  publicRuntimeConfig: {
    googleAnalytics: {
      id: process.env.GOOGLE_ANALYTICS_ID
    }
  },
 */

idは環境変数で指定していますが、直接指定しても問題ありません。
オプションの項目などはドキュメントで説明があります。
https://www.npmjs.com/package/@nuxtjs/google-gtag

GA4で確認する

GA4にアクセスしてデータ収集が有効となれば上手く設定できています。