I'm using gtag.js
to set up two different trackers in a Vue.js SPA. I'm defining the trackers in my index.html
like:
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXXX-1', {
'send_page_view': false
});
gtag('config', 'UA-XXXXXXXX-2', {
'send_page_view': false,
'custom_map': {
'dimension1' : 'my_custom_dimension'
}
});
</script>
And then, in my router's afterEach
navigation guard I do:
router.afterEach((to, from) => {
gtag("event", "page_view", {
send_to: 'UA-XXXXXXXX-1'
});
gtag("event", "page_view", {
send_to: 'UA-XXXXXXXX-2',
my_custom_dimension: 'custom_value'
});
}
});
There's no other GA code involved, but when I look at the GA Debug Extension log, for a single page load, I see that it creates the two trackers but then I also get a warning message saying:
analytics_debug.js:24 Ignoring create request for duplicate tracking name.
I couldn't find any clear information about that warning and so far I've been unable to understand why is it happening and how to avoid it. So, any help on avoiding this will be much appreciated!