vue2-ya-metrika

Safe Vue Yandex Metrika

vue2-ya-metrika allows you to send data about visited pages to Yandex Metrika and call its API methods.

And it will not crush your site, even browser cut out trackers!

Inspired by vue-yandex-metrika package https://github.com/vchaptsev/vue-yandex-metrika and this issue https://github.com/vchaptsev/vue-yandex-metrika/issues/10

Installation

Install with yarn:

$ yarn add vue2-ya-metrika

Install with npm:

$ npm install vue2-ya-metrika --save

Ways to use

Autotracking

Pass the VueRouter instance to the plugin and let it handle everything for you (Metrika API is also available):

// your main.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import VueYandexMetrika from 'vue2-ya-metrika'                               

const router = new VueRouter({...}) // your routes

Vue.use(VueYandexMetrika, {
    id: XXXXXXXX,
    router: router,
    env: process.env.NODE_ENV
    // other options
})

Manual tracking

Works without router: Metrika API

// your main.js
import Vue from 'vue'
import VueYandexMetrika from 'vue2-ya-metrika'                               

Vue.use(VueYandexMetrika, {
    id: XXXXXXXX,
    env: process.env.NODE_ENV
    // other options
})

---

// your code
this.$metrika.hit(path)

Options:

Name	Description	Required	Default
id	Your tracking id	True	null
router	Autotracking if the router is passed, otherwise: manual tracking	False	null
env	API calls are performed only if env is "production"	False	development
injectScript	Inject Yandex Metrika script	False	true
scriptSrc	Src of metrika script to use	False	https://mc.yandex.ru/metrika/tag.js
debug	If env is not "production" and debug is true: API calls are replaced by console.log()	False	false
ignoreRoutes	List of ignored routes names	False	[]
skipSamePath	Do not track a page visit if previous and next routes URLs match	False	true
options	Original Yandex Metrika options	False	{clickmap:true, trackLinks:true, accurateTrackBounce:true}