nuxtにグーグルアナリティクスを導入

nuxtにグーグルアナリティクスを導入するにつまづいた。

今はグーグルアナリティクス4というのが新しくリリースされていて今後はこちらが推奨になるとの事。
久しぶりの導入だったので何がなんだが....。

nuxtでグーグルアナリティクスを設定するのものすごく簡単でした。
でも、google様の変更は知らなかったし、つまづいたので備忘録。

まず、nuxtにグーグルアナリティクスを設定する方法
1.analytics-moduleをインストールする

yarn add @nuxtjs/google-analytics

2.nuxt.config.jsを設定する

  buildModules：[
    ['@nuxtjs/google-analytics', {
      id: 'トラッキングIDだよ、UAから始まるやつ。GAから始まるやつに騙されないで'
    }]
  ],

以上だけで設定完了。
該当ページを開いてからグーグルアナリティクスのリアルタイム人数が1になっていれば大丈夫かと。
公式よりnuxtのversionが２．９以下の場合はmodule:に書いてねとの事。

つまづいたの点
トラッキングIDをグーグルアナリティクス4の測定IDと勘違いした。
Google アナリティクス 4 プロパティとユニバーサルアナリティクスプロパティが違うものだと分からなかった。


トラッキングID作成方法
今は詳細オプションで設定しないとだめな様子。

1.グーグルアナリティクスにログイン
2.プロパティの設定で詳細オプションを表示をクリック
3.ユニバーサルアナリティクスプロパティの作成で必要事項入力
4.UAから始まるコードをゲット。

整理整頓
Google アナリティクス 4 プロパティとユニバーサルアナリティクスプロパティは違うもの。
ユニバーサルアナリティクスプロパティが従来のもの
Google アナリティクス 4 プロパティが最新、推奨のもの　
設定方法も全然違うので注意。