4

I am trying to setup Google Analytics tracking for a Nuxt.js application but I'm not getting any data at all. I feel like I must be missing something obvious.

I have looked at https://google-analytics.nuxtjs.org/ and gone through the first setup page. Do I need to do anything more? The documentation promises that the router instance is added out of the box during installation, so it should handle page tracking automatically, but this has not been my experience.

I have added the Google Analytics module twice, as seen below, to nuxt.config.js just looking for a pulse but no such luck. I have also tried each individually. The ID I am passing in is already being used on another website, and my application builds without errors:

buildModules : [
  '@nuxtjs/eslint-module',
  '@nuxtjs/style-resources',
  '@nuxtjs/google-analytics'
],
googleAnalytics: {
  id: 'GTM-MYIDHERE',
  layer: 'dataLayer',
  pageTracking: true
},
modules : [
  ['nuxt-modernizr',
    {
      'feature-detects' : ['touchevents', 'img/webp'],
      options : ['setClasses']
    }],
    ['@nuxtjs/google-analytics', { 
      id: 'MYIDHERE',
      layer: 'dataLayer',
      pageTracking: true
    }]
],

Any help here would be greatly appreciated.

kissu
  • 40,416
  • 14
  • 65
  • 133
d-fws
  • 51
  • 1
  • 6
  • You should probably remove the `@nuxtjs/google-analytics` to prevent any issues. And if Michele's solution is not working, you should probably have an error in your browser's console. – kissu Jul 15 '21 at 07:50
  • @kissu - Do you mean remove it from the buildModules or remove it from the modules? – d-fws Jul 16 '21 at 14:53
  • In the setup, it never mentions `modules`, so yeah: remove it from `modules`. https://google-analytics.nuxtjs.org/setup/ – kissu Jul 16 '21 at 14:55
  • If your Nuxt version is `< v2.9`, let it in modules yeah. But I hope it's not that old. – kissu Jul 16 '21 at 14:56

1 Answers1

4

You are entered a wrong id:

googleAnalytics: {
  id: 'GTM-MYIDHERE', // <-- GTM- is Google Tag Manager ID
  layer: 'dataLayer',
  pageTracking: true
},

You have to create an Universal Analytics Property and use UA-XXXXXX-XX code.

See here how to create an UA Property: setup Google Analytics 4 in nuxt.js

Or, if you want to use GA4 Property (which is what has the ids in the format G-XXXXXXXXXX) you can try to use vue-gtag package by creating a plugin: https://github.com/MatteoGabriele/vue-gtag

kissu
  • 40,416
  • 14
  • 65
  • 133
Michele Pisani
  • 13,567
  • 3
  • 25
  • 42
  • Thanks. In addition, I had to specify that I wanted to log events in debug. Adding debug: { sendHitTask: true } to googleAnalytics and changing the ID so it's the right ID did the trick. – d-fws Jul 20 '21 at 19:41