vue error 해결법 : Error in render: "TypeError: Cannot read property 'matched' of undefined"

vue 에서 router에 명시해준 주소로 이동을 하려고 할때 아래와 같은 에러가 발생하는 경우가 있다.

Error in render: "TypeError: Cannot read property 'matched' of undefined"

 

이와 같은 에러는 제대로 명시를 하지않았음을 의미한다.

vue 에 router 를 연결할 시에 이러한 현상이 발생했다면 원인은 

main.js 파일에서 router 를 routes로 잘못명시한경우 일 가능성이 크다.

예를 들면 아래와 같다.

잘못된 코드

import routes from './routes.js'

new Vue({
  render: h => h(App),
  routes
}).$mount('#app')

  

router 연결은 반드시 router로 명시 해주어야한다.

따라서 아래와 같이 수정한다.

import router from './routes.js'

new Vue({
  render: h => h(App),
  router
}).$mount('#app')

 

또는 아래와 같이 명시하는 경우도 가능하다.

import routes from './routes.js'

new Vue({
  render: h => h(App),
  router: routes
}).$mount('#app')