如何将 Google 分析集成到您的 Nuxt.js 应用中

Question

我制作了 nuxt.js 应用程序，我想集成 Google Analytics。我找到了 @nuxtjs/google-analytics 软件包，安装了它并按照文档中的说明进行了所有操作，但它仍然无法正常工作。

这里是nuxt.config.js

module.exports = {
...
modules: [
    // Doc: https://axios.nuxtjs.org/usage
    '@nuxtjs/axios',
    '@nuxtjs/pwa',
    // 'nuxt-basic-auth-module',
    '@nuxtjs/google-analytics',
    '@nuxtjs/recaptcha'
  ],
  googleAnalytics: {
    id: process.env.GA_ID || ''
  },
}

在浏览器网络中加载页面时我可以看到 analytics.js，但是在 analytics.google.com 页面上我什么也看不到，甚至没有在线用户。

此外，我尝试添加按钮点击事件，功能如下：

async showLogin() {
  this.$ga.event({
    eventCategory: 'login',
    eventAction: 'login',
    eventLabel: 'login',
    eventValue: 1
  });
  await this.$router.push(`/${this.$store.state.locale}/login`)
},

这就是当用户单击登录按钮时发生的情况，正如我所说，analytics.google.com 页面上没有信息，浏览器网络中也没有信息。

那么，我做错了什么？如果有人已经使用过 Nuxt 和 Google Analytics，您是如何将其集成到您的应用程序中的？关于这个问题，我在网上没有找到很多资料，但是我尝试了所有我找到的东西，还是不行。

Answer 1

nuxt.config.js

const testingAnalytics = false

module.exports = {
  buildModules: [
    '@nuxtjs/google-analytics'
  ],
  googleAnalytics: {
    id: '', 
    /* 
      If testingAnalytics  === true than send test hits

      If testingAnalytics  === false than enable analytics
      only when process.env.NODE_ENV === 'production'
    */
    dev: testingAnalytics ? true : process.env.NODE_ENV !== 'production',
    debug: testingAnalytics
      ? {
        enabled: true,
        sendHitTask: true
      }
      : {}
  }
}

如何将 Google 分析集成到您的 Nuxt.js 应用中

How to integrate Google Analytics into your Nuxt.js App

javascript

google-analytics

vue.js

nuxt.js