Tengo una aplicación Vue escrita en Typescript, para la cual el seguimiento a través de Google Analytics necesita dimensiones personalizadas. El paquete "vue-gtag" parecía ser la mejor opción, así que lo instalé. Leí la documentación e intenté configurarlo de la misma manera.

En mi principal, está incluido en Vue así:

 Vue.use(VueGtag, { config: { id: 'GTM-XXXXXXX' }, router, });

Mi enrutador está configurado así:

 Vue.use(VueRouter); const routes: Array<RouteConfig> = [ { path: '', component: LoggedInLayout, meta: { requiresAuth: true, }, children: [ // Children that require auth { path: '', redirect: '/dashboard', }, { path: '/dashboard', name: 'Dashboard', component: Dashboard, }, { path: '/settings', name: 'User Settings', component: UserSettings, meta: { title: 'Custom page title' }, }, { path: '/search/:page', name: 'Search', component: Search, props: (route) => ({ ...route.params, }), meta: { title: 'Custom page title' }, }, // More like this ], }, { path: '', component: DefaultLayout, meta: { requiresAuth: false, }, children: [ // Children that don't require auth { path: '', redirect: '/home', }, { path: '/home', name: 'Home', component: Home, meta: { title: 'Custom page title' }, }, { path: '/about', name: 'About', component: About, meta: { title: 'Custom page title' }, }, { path: '/contact', name: 'Contact', component: Contact, meta: { title: 'Projektagenten - Kontakt Os' }, }, // More like this // Any other path we redirect to home { path: '*', redirect: '', }, ], }, ]; const router = new VueRouter({ mode: 'history', routes, scrollBehavior: (to) => { if (to.hash) { return { selector: to.hash, }; } else { return { x: 0, y: 0 }; } }, }); // Authentication guard for routes with authentication required router.beforeEach((to, from, next) => { if (to.matched.some((record) => record.meta.requiresAuth == true)) { if (!cookieUtils.getCookie('session')) { next({ name: 'Home' }); } else { next(); } } else { next(); } }); router.afterEach((to, from) => { Vue.nextTick(() => { document.title = to.meta.title || to.name; }); }); export default router;

Mi problema comienza cuando ejecuto el proyecto y abro la página del proyecto, aparece una página en blanco y el siguiente error en la consola:

Parece que he activado una llamada recursiva interminable dentro de vue-gtag, ya que el código fuente se ve así:

Estoy teniendo dificultades para identificar este error y lo que hice mal. Se agradece cualquier ayuda, también diferentes soluciones a la tarea que inicialmente estoy tratando de realizar.