Nuxt.js で app.html を作る際、地味にハマったコト

GTM と YTM を Nuxt.js プロジェクトに設定しているが、YTM を設定する

Google Tag Manager

GTMは @nuxtjs/google-tag-manager を利用すれば簡単に設定できる。

Yahoo Tag Manager

YTMはmodule化されていないため、生HTMLタグで設定する必要がある。

    <script id="tagjs" type="text/javascript">
      (function () {
        var tagjs = document.createElement("script");
        var s = document.getElementsByTagName("script")[0];
        tagjs.async = true;
        tagjs.src = "//s.yjtag.jp/tag.js#site=hogehoge";
        s.parentNode.insertBefore(tagjs, s);
      }());
    </script>
    <noscript>
      <iframe src="//b.yjtag.jp/iframe?c=hogehoge" width="1" height="1" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe>
    </noscript>

Nuxt.js でYTM設定をする場合、app.html を作成して設定しちゃうのが手っ取り早い（というかソレ以外どうするのが良いとかあるのかな？）。

app.html は srcDir に配置する。

テンプレートを変更するために、プロジェクトのルートフォルダに app.html ファイルを作成します。

ビュー - Nuxt.js

と公式には書かれているが、もし nuxt.config.js にて srcDir を指定していた場合は、 srcDir に配置する必要があった。