注意:@gtm-support/vue-gtm が最新です。
下記は2019年頃のやり方です。
Vue-CLI 3でGTMを入れる
プラグインがあった。
https://www.npmjs.com/package/vue-gtm
どこに書くのか
自分の場合はvue-routerを使うのでそこに書いておきました。
router.js
import VueGtm from 'vue-gtm'
開発用サーバーのアクセスが混ざらないように、分けておきます。
GTMのタグは開発用と、本番用の2つ用意した方が良いです。
router.js
if(location.hostname != 'www.example.com'){
Vue.use(VueGtm, {
id: 'GTM-▲▲▲▲',//開発用
enabled: true,
debug: true,
// vueRouter: router,
ignoredViews: ['']
});
}else{
Vue.use(VueGtm, {
id: 'GTM-●●●●',//本番環境
enabled: true,
debug: true,
// vueRouter: router,
ignoredViews: ['']
});
}
「vueRouter: router」が(私の場合)うまくうごかないように思ったので
コメントアウトしてます。GTM側のトリガーで対応しました。