Nuxtで作成したアプリをNetlifyでデプロイし、GoogleAnalyticsを設定する方法

Netlify無料版ではアナリティクス(訪問者数)などの確認ができないため、グーグルアナリティクスと連携しました。忘れないためにも残しておきます。

1.Nuxtで環境変数とアナリティクスを使用できるようにする

◆dotenvをインストール

npm install @nuxtjs/dotenv

◆nuxt.config.jsに下記を追加

buildModules: [
    '@nuxtjs/dotenv'
],

◆google-gtagをインストール

npm install @nuxtjs/google-gtag

◆nuxt.config.jsに下記を追加

  modules: ['@nuxtjs/google-gtag'],
  'google-gtag': {
    id: process.env.GOOGLE_ANALYTICS_TRACKING_ID,  //後ほどNetlifyに環境変数を追加します
  },

2.Netlifyでデプロイする

◆デプロイしたいGithubのレポジトリと連携しデプロイ

※npm run generateを選択
参照：https://develop365.gitlab.io/nuxtjs-2.8.X-doc/ja/faq/netlify-deployment/

3.GoogleAnalyticsに登録し、デプロイしたサイトを設定idを取得

◆管理➡データストリームをクリック

◆ストリームを追加で種類を選択(ウェブ）

◆先ほどデプロイしたURLを設定すると測定IDが付与される

4.Netlifyに環境変数を設定

◆Netlifyの管理画面でsitesettings ➡　build&deployをクリック

◆Enviromentの欄でGoogleAnalyticsの測定IDを追加

以上の設定でGoogleAnalyticsでアクセス数などを確認できるようになりました！
ご参考程度に🙇‍♂️！