@nuxtjs/google-gtag

Google GTag for Nuxt.js

Stats

StarsIssuesVersionUpdatedCreatedSize
@nuxtjs/google-gtag
1.0.43 years ago3 years agoMinified + gzip package size for @nuxtjs/google-gtag in KB

Readme

@nuxtjs/google-gtag

npm (scoped with tag) npm CircleCI Codecov Dependencies js-standard-style

Google official gtagjs for Nuxt.js

📖 Release Notes

Features

The module includes Google googletagmanager.com/gtag/js into your project and enables it with config you pass in as options.

  • Check the official reference gtag

Setup

  • Add @nuxtjs/google-gtag dependency using yarn or npm to your project
  • Add @nuxtjs/google-gtag to modules section of nuxt.config.js
{
  modules: [
    // Simple usage
    '@nuxtjs/google-gtag',

    // With options
    ['@nuxtjs/google-gtag', { /* module options */ }],    
 ]
  
 // example config
 'google-gtag':{
   id: 'UA-XXXX-XX', // required
   config:{
     // this are the config options for `gtag
     // check out official docs: https://developers.google.com/analytics/devguides/collection/gtagjs/
     anonymize_ip: true, // anonymize IP 
     send_page_view: false, // might be necessary to avoid duplicated page track on page reload
     linker:{
       domains:['domain.com','domain.org']
     }
   },
   debug: true, // enable to track in dev mode
   disableAutoPageTrack: false, // disable if you don't want to track each page route with router.afterEach(...)
   // optional you can add more configuration like [AdWords](https://developers.google.com/adwords-remarketing-tag/#configuring_the_global_site_tag_for_multiple_accounts)
   additionalAccounts:[{
     id: 'AW-XXXX-XX', // required if you are adding additional IDs
     config:{
       send_page_view:false // optional configurations
     }
   }]
  }
}

Usage

This module inlcudes Google gtag in your NuxtJs project and enables every page tracking by default. You can use gtag inside of your components/functions/methods like follow:

  this.$gtag('event', 'your_event', { /* track something awesome */})

Check functionalities

Install Google Tag Assistant and see if your page is being tracked.

Development

  • Clone this repository
  • Install dependencies using yarn install or npm install
  • Start development server using npm run dev

License

MIT License

Copyright (c) Dominic Garms djgarms@gmail.com

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.