Get started
vue-gtag documentation page
The global site tag (gtag.js) is a JavaScript tagging framework and API that allows you to send event data to Google Analytics, Google Ads, and Google Marketing Platform. For general gtag.js documentation, read the gtag.js developer guide.
Install
$ npm add vue-gtag
Add plugin to your application
This is the basic installation required to start using the plugin
import Vue from "vue";
import App from "./App.vue";
import VueGtag from "vue-gtag";
Vue.use(VueGtag, {
config: { id: "UA-1234567-1" }
});
new Vue({
render: h => h(App)
}).$mount("#app");
After this you will be able to use the gtag
library inside your components contextually by accessing it like this example
export default {
name: 'MyComponent',
methods: {
login () {
this.$gtag.event('login', { method: 'Google' })
}
}
}
Initial config parameters
The config object accepts also a params
property that will add additional parameters to your initial config call
import Vue from "vue";
import App from "./App.vue";
import VueGtag from "vue-gtag";
Vue.use(VueGtag, {
config: {
id: "UA-1234567-1",
params: {
send_page_view: false
}
}
});
new Vue({
render: h => h(App)
}).$mount("#app");
Here is the perfect moment to add the send_page_view property to false if you don't want to send the first page hit on load of your application
Last updated