How to connect google analytics to Nuxt3 app?

Question

I have a problem. I try to connect my Nuxt3 app with Google Analytics.

right now I do it by adding to nuxt.config.ts following code

export default defineNuxtConfig({
  buildModules: [
    '@nuxtjs/google-analytics'
  ],
  googleAnalytics: {
    id: process.env.GOOGLE_ANALYTICS_ID
  },
})

but unfortunately I get following error when I try to build my app

ERROR  Error compiling template:  {                                                                                                                                                                            17:53:04  
  ssr: false,
  src: 'C:\\Users\\szczu\\Elektryk\\node_modules\\@nuxtjs\\google-analytics\\lib\\plugin.js',
  fileName: 'google-analytics.js',
  options: {
    dev: true,
    debug: {
      sendHitTask: true
    },
    id: undefined
  },
  filename: 'google-analytics.js',
  dst: 'C:/Users/szczu/Elektryk/.nuxt/google-analytics.js'
}


 ERROR  serialize is not defined                                                                                                                                                                                17:53:04  

  at eval (eval at <anonymous> (node_modules\lodash.template\index.js:1550:12), <anonymous>:7:1)
  at compileTemplate (/C:/Users/szczu/Elektryk/node_modules/@nuxt/kit/dist/index.mjs:493:45)
  at async /C:/Users/szczu/Elektryk/node_modules/nuxt3/dist/chunks/index.mjs:1296:22
  at async Promise.all (index 11)
  at async generateApp (/C:/Users/szczu/Elektryk/node_modules/nuxt3/dist/chunks/index.mjs:1295:3)
  at async _applyPromised (/C:/Users/szczu/Elektryk/node_modules/perfect-debounce/dist/index.mjs:54:10)

Does anyone have an idea how to fix it?

Answer 1

Try the vue-vtag-next package as a plugin

yarn add --dev vue-gtag-next

Create a plugin file plugins/vue-gtag.client.js

import VueGtag from 'vue-gtag-next'

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(VueGtag, {
    property: {
      id: 'GA_MEASUREMENT_ID'
    }
  })
})