@matzeso I came to this topc with the exact problem and my “solution” looked like yours, so I think it’s relevant here. I’ve now a solution which is somewhat a workaround but still playing by the rules. I use route meta fields in routes.js and markup any route that should have my auth guard with requiredAuth meta field.

const routes = [
  {
    path: '/home',
    component: () => import('layouts/BaseLayout.vue'),
    children: [
      { path: '',
        name: 'pagename',
        meta: { requireAuth: true },
        component: () => import('pages/HomePageName.vue') }
    ]
  }
]

In router/index.js I then I pass store as an argument in the export default function and implement a beforeEach that checks the meta field. So the guard that require access to the store and a getter, is moved into a beforeEach function. It’s not strictly the same but good enough for me.

export default function ({ store }) {
  const Router = new VueRouter({
  ...
  })

  Router.beforeEach((to, from, next) => {
    if (to.matched.some(record => record.meta.requireAuth)) {
      if (store.getters['auth/isSignedIn']) {
        next()
      } else {
        next({ name: 'account-signin', query: { next: to.fullPath } })
      }
    } else {
      next()
    }
  })

  return Router
}

So a little mix of previous replies by @metalsadman and others, with other parts of vue-router made it work for me.