README

Google Analytics

Add Google Analytics to your nuxt.js application.

This plugins automatically sends first page and route change events to Google Analytics.

yarn add @rabota/google-analytics

npm install --save @rabota/google-analytics

Features
Setup
Options
Examples
Methods
Links
License
Author

Features

Supports multiple IDs
You can pass an async function to provide IDs
Easy-to-use API
Automatically handling all SPA caveats (spa: true option)
gtag API
Logging

Note: Google Analytics is disabled in development mode by default. You can set development option to true to run Google Analytics in development mode.

Setup

Add @rabota/google-analytics dependency using yarn or npm to your project
Add @rabota/google-analytics to modules section of nuxt.config.js

{
  modules: [
    ['@rabota/google-analytics', [
      counter: 'GA_TRACKING_ID', // main tracking ID
      includeCounters: [ 'GA_TRACKING_ID_2', ..., 'GA_TRACKING_ID_3' ], // additional tracking IDs
      options: {
       // google analytics options
      },
      spa: true, // sends new pages to GA in SPA
      logging: true, // logs all events to each counter
      development: true
    }]
  ]
}

Options

`counter`

{string|Function} Tracking ID

Could be an async function that returns an ID.

`includeCounters`

{string|Array<string>|Function} Additional tracking IDs

Could be an async function that returns one or array of IDs.

`options`

{Object} Google Analytics (todo)

`spa`

{boolean} Sends new pages & pageviews to GA in SPA (default: true).

`logging`

{boolean} Output all sending events for each counter (default: false).

`development`

{boolean} set true if you want to run GA in dev mode. By default GA is disabled in dev mode.

Methods

this.$ga - is a Layer Instance.

`#pushAll`

Same as gtag function of GA. Sends data to all trackers.

`#pushTo`

The same as gtag function of GA. Sends data to specific tracker.

More information about GA routing: https://developers.google.com/gtagjs/devguide/routing

More methods or properties you can find here: @rabota/analytics-layer/src/layer.js.

Examples

After setup you can access the GA through this.$ga instance in any component you need.

export default {
  mounted () {
    this.$ga.pushAll('event', 'add_to_cart', {
      'items': [
        'id': 'U1234',
        'ecomm_prodid': 'U1234',
        'name': 'Argyle Funky Winklepickers',
        'list': 'Search Results',
        'category': 'Footwear',
        'quantity': 1,
        'ecomm_totalvalue': 123.45,
        'price': 123.45
      ]
    });
  }
}

Send to a specific tracker

export default {
  mounted () {
    this.$ga.pushTo( 'GA_TRACKING_ID', 'event', 'event-name', params );
  }
}

License

MIT

@rabota/google-analytics

Usage no npm install needed!