router guard 오류 질문

import Vue from "vue";
import VueRouter from "vue-router";
import ItemView from "../views/ItemView.vue";
import UserView from "../views/UserView.vue";
import ListView from '../views/ListView.vue';
import bus from '../utils/bus.js';
import store from '../store/index.js';

Vue.use(VueRouter);

export default new VueRouter({
  mode: "history",
  routes: [
    {
      path: "/",
      redirect: "/news"
    },
    {
      path: "/news",
      name:'news',
      component: ListView,
      beforeEnter: (to,from,next) =>{
        bus.$emit('start:spinner');
        store.dispatch('FETCH_LIST', to.name)
          .then(() => {
            bus.$emit('end:spinner');
            next();
          })
          .error(error => console.log(error))
      }
    },
    {
      path: "/ask",
      name: 'ask',
      component: ListView,
      beforeEnter: (to, from, next) => {
        bus.$emit('start:spinner');
        store.dispatch('FETCH_LIST', to.name)
          .then(() => {
            bus.$emit('end:spinner');
            next();
          })
          .error(error => console.log(error))
      }
    },
    {
      path: "/jobs",
      name : 'jobs',
      component: ListView,
      beforeEnter: (to, from, next) => {
        bus.$emit('start:spinner');
        store.dispatch('FETCH_LIST', to.name)
          .then(() => {
            bus.$emit('end:spinner');
            next();
          })
          .error(error => console.log(error))
      }
    },
    {
      path: "/item/:id",
      component: ItemView
    },
    {
      path: '/user/:id',
      component: UserView
    }
  ]
});

현재 저의 routes/index.js의 파일입니다.

vscode상에는 오류가 없다고 나오는데

크롬 콘솔창에서 news/ask/jobs를 이동할 때 마다 다음과 같은 오류가 뜹니다. 오류 때문에 작동 되지 않는 것은 아니지만 나중에 혹여나 에러가 쌓이면서 문제가 될까봐 질문 드립니다. 구글링을 했을때는 저와 비슷한 상황인 분을 못찾아서 해결을 잘 못하겠습니다. 제 의견상으로는 제가 어디서 실수를 한것 같은데 해당 오류로는 자세히 찾지 못하겠습니다..

+) 현재 저는 mixins로 하지 않고 HOC로 사용하고 있고 ListView는 그때 당시 만든 컴포넌트입니다.

인프런 커뮤니티 질문&답변