GTM work on preview mode and doesn't work on the production site

I am posting this issue and answering it because I faced a problem for two days didn't understand what I was doing wrong. My problem was that after implementing vue-gtm on my SPA That it works perfectly when I test on the preview mode on the google tag manager but it wasn't working on production.

The issue that vue-gtm example set it to work only on preview and you will need to disable that by removing the configs:


app.use(createGtm({
  id: 'GTM-xxxxxx' or ['GTM-xxxxxx', 'GTM-yyyyyy'], // Your GTM single container ID or array of container ids ['GTM-xxxxxx', 'GTM-yyyyyy']
  queryParams: { // Add url query string when load gtm.js with GTM ID (optional)
    gtm_auth:'AB7cDEf3GHIjkl-MnOP8qr',
    gtm_preview:'env-4',
    gtm_cookies_win:'x'
  },
  defer: false, // defaults to false. Script can be set to `defer` to increase page-load-time at the cost of less accurate results (in case visitor leaves before script is loaded, which is unlikely but possible)
  enabled: true, // defaults to true. Plugin can be disabled by setting this to false for Ex: enabled: !!GDPR_Cookie (optional)
  debug: true, // Whether or not display console logs debugs (optional)
  loadScript: true, // Whether or not to load the GTM Script (Helpful if you are including GTM manually, but need the dataLayer functionality in your components) (optional)
  vueRouter: router, // Pass the router instance to automatically sync with router (optional)
  ignoredViews: ['homepage'], // Don't trigger events for specified router names (case insensitive) (optional)
  trackOnNextTick: false, // Whether or not call trackView in Vue.nextTick
}));

You will need to remove this line. gtm_preview:'env-4', and maybe the other params if you don't use them.

mib200 / vue-gtm

GTM work on preview mode and doesn't work on the production site #100