概要:NextjsのサイトをGoogle Analyticsで。。。
Vercelには独自のアクセス解析機能がありますが、nextプロジェクトをGoogle Analyticsで解析しようと実施。
公式サイトにサンプル
アクセスないので、あまり関係ないのですが、soften.siteにGoogle Analyticsを仕込みました。
サンプルはNextjsの公式にあります。
今までにノーマルに専用タグを追加したことがあれば大丈夫です。
サンプルファイルを見れば、おおよそ編集可能です。
触るファイルは以下の3つだけです。
pages > _app.js lib > gtag.js .env
自分サイトではsrc > pagesと階層に相違がある場合もあるかと思いますが、_app.jsでimportするときの階層をあわせれば問題ありません。
ESlintのキャメルケースのルール
プロジェクトにESlintを入れていて、キャメルケースのルールを指定している場合、gtag.js内の書き方で注意されるかもです。
適宜対応してください。