Nuxt Analytics & PWA (service worker)
kaboume opened this issue ยท 12 comments
What problem does this feature solve?
After installed the nuxt PWA module in my nuxt application, my application stopped to send the data to Google Analytics (whit the Nuxt Analytics module).
After many hours, I found a solution to let the module work again.
I had to add in the nuxt.config.js the sendHitTask like that
googleAnalytics: {
id: process.env.GOOGLE_ANALYTICS_ID,
debug: {
enabled: false,
sendHitTask: true
}
},
If you know why....
I've just noticed this issue today where no events were being fired after a certain point. I assume that it was after I configured the site to be completely PWA with the @nuxtjs/pwa
package.
The website previously had a running service worker and was firing GA events without a problem, so it could be an issue after enabling HTTP2 push or somewhere during change to PWA.
I've got the same problem. When @nuxtjs/pwa
module is installed, the analytics module doesn't work unless I set:
debug: {
sendHitTask: true,
}
Same issue
This problem seems to exist even with the core Vue-Analytics plugin, i.e., irrespective of whether this nuxt analytics-module is used, or vue-analytics is used as a plugin. It started happening around 3 weeks back. I have been unable to get it working even with sendHitTask: true
.
Update: After some playing around, I have been able to get it working by including the core Vue-Analytics plugin directly.
Update: After some playing around, I have been able to get it working by including the core Vue-Analytics plugin directly.
Could you elaborate on that, I'm curious as I'm also running into this problem now. Did you use the analytics module or did you completely remove it and used the vue-analytics plugin?
@Aanhane I completely removed the analytics-module and used the vue-analytics plugin.
Is there any source code / guide available on how to do this? I will do the same as well.
-
Remove analytics-module from package.json.
-
Add vue-analytics to package.json.
-
Create plugin file vueAnalytics.js:
import Vue from 'vue' import VueAnalytics from 'vue-analytics' export default (ctx, inject) => { Vue.use(VueAnalytics, { id: 'xx-xxxxxxx-x', checkDuplicatedScript: true, debug: { enabled: false, trace: false, sendHitTask: process.env.NODE_ENV === 'production' }, router: ctx.app.router }) ctx.$ga = Vue.$ga inject('ga', Vue.$ga) }
-
include it as a plugin in the
nuxt.config.js
file:plugins: [ '~/plugins/vueAnalytics.js' ]
Nuxt.js v2.10.0 broke the analytics-module for me.
I reverted back to v2.9.2, and everything seems to be working again.
Tbh I don't understand why there's so much boilerplate around the plug-in. When it started it was a simple wrapper of vue-analytics with router automatically attached to it, now they are not in sync anymore with all these default options on top of other default options
This has been fixed as @bigsee said