VuePressにgoogleアナリティクスを設置する方法。(meteorlxyでも出来ます)1行追記してあげるだけ。

VuePressで作成したブログ(当ブログ)にgoogleアナリティクスを連携させたいと思ったのですが、各ページの内容を実際に触って編集するファイルはHTMLファイルじゃなくてmdファイルなので、「あれ、どうやってheadにコードを追加すればいいんだ？」ってなった訳です。

調べて見ると…アナリティクスを連携させる為のプラグインがありました。
まずはプラグインをインストールしましょう。

プラグインをインストール

yarn add -D @vuepress/plugin-google-analytics  
又は↓
<!-- npm install -D @vuepress/plugin-google-analytics -->

yarn 又は npmでプラグインをインストールします。
私はnpmでインストールしました。

※VuePress運営側はYarnでプラグインをインストールすることを推奨しています。

config.jsに追記

module.exports = {
  plugins: [
    [
      '@vuepress/plugin-google-analytics',
      {ga: 'トラッキングID'},
    ]
  ],
}

上記の記述をconfig.jsに追記してあげましょう。
トラッキングIDは、本来headに挿入する予定だったトラッキングコードから取得できます。

トラッキングコードの例↓

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=トラッキングID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'トラッキングID');
</script>

あとは通常通りbuildして反映してあげましょう。