• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

안녕하세요 강의대로 진행하고 공부하고 있는데 다음과 같은 오류가 발생합니다. 어떻게 조치하면 좋을까요?

23.06.24 08:47 작성 조회수 383

1

오류 내용입니다.

export 'default' (imported as 'VueRouter') was not found in 'vue-router' (possible exports: NavigationFailureType, RouterLink, RouterView, START_LOCATION, createMemoryHistory, createRouter, createRouterMatcher, createWebHashHistory, createWebHistory, isNavigationFailure, matchedRouteKey, onBeforeRouteLeave, onBeforeRouteUpdate, parseQuery, routeLocationKey, routerKey, routerViewLocationKey, stringifyQuery, useLink, useRoute, useRouter, viewDepthKey)

 

 

 

package.json입니다.

{ "name": "frontend", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, "dependencies": { "core-js": "^3.8.3", "vue": "^3.2.36", "vue-router": "^4.0.13" }, "devDependencies": { "@babel/core": "^7.12.16", "@babel/eslint-parser": "^7.12.16", "@vue/cli-plugin-babel": "~5.0.0", "@vue/cli-plugin-eslint": "~5.0.0", "@vue/cli-service": "~5.0.0", "eslint": "^7.32.0", "eslint-plugin-vue": "^8.0.3" }, "eslintConfig": { "root": true, "env": { "node": true }, "extends": [ "plugin:vue/vue3-essential", "eslint:recommended" ], "parserOptions": { "parser": "@babel/eslint-parser" }, "rules": {} }, "browserslist": [ "> 1%", "last 2 versions", "not dead", "not ie 11" ] }

 

감사합니다.

답변 3

·

답변을 작성해보세요.

0

안녕하세요, 제가 확인이 늦었네요. 첨부해 주신 로그를 보기가 어려운데 코드 포맷팅해서 다시 올려주실 수 있으실까요? 그리고 작성하신 로직도 같이 첨부해 주세요 :)

0

함성호님의 프로필

함성호

질문자

2023.07.01

버전을 오히려 낮춰서 해보고 있는데

터미널 창에선 오류가 발생하지 않지만, 개발자도구에서 확인할 때 다음과 같은 오류가 발생합니다.

간단한 라우팅 부분인데도 시간이 너무 오래걸려서... 힘듭니다 ㅠ 확인해주세요

 

Vue warn]: Error in beforeCreate hook: "TypeError: this._router.init is not a function"

(found in <Root>)

warn @ vue.runtime.esm.js:4605

logError @ vue.runtime.esm.js:3045

globalHandleError @ vue.runtime.esm.js:3041

handleError @ vue.runtime.esm.js:3008

invokeWithErrorHandling @ vue.runtime.esm.js:3024

callHook$1 @ vue.runtime.esm.js:4031

Vue._init @ vue.runtime.esm.js:5689

Vue @ vue.runtime.esm.js:5762

eval @ main.js:9

./src/main.js @ app.js:276

__webpack_require__ @ app.js:348

(anonymous) @ app.js:1470

__webpack_require__.O @ app.js:394

(anonymous) @ app.js:1471

(anonymous) @ app.js:1473

vue.runtime.esm.js:3049 TypeError: this._router.init is not a function

at Vue.beforeCreate (vue-router.esm.js:1298:1)

at invokeWithErrorHandling (vue.runtime.esm.js:3017:1)

at callHook$1 (vue.runtime.esm.js:4031:1)

at Vue._init (vue.runtime.esm.js:5689:1)

at new Vue (vue.runtime.esm.js:5762:1)

at eval (main.js:9:1)

at ./src/main.js (app.js:276:1)

at __webpack_require__ (app.js:348:33)

at app.js:1470:109

at __webpack_require__.O (app.js:394:23)

logError @ vue.runtime.esm.js:3049

globalHandleError @ vue.runtime.esm.js:3041

handleError @ vue.runtime.esm.js:3008

invokeWithErrorHandling @ vue.runtime.esm.js:3024

callHook$1 @ vue.runtime.esm.js:4031

Vue._init @ vue.runtime.esm.js:5689

Vue @ vue.runtime.esm.js:5762

eval @ main.js:9

./src/main.js @ app.js:276

__webpack_require__ @ app.js:348

(anonymous) @ app.js:1470

__webpack_require__.O @ app.js:394

(anonymous) @ app.js:1471

(anonymous) @ app.js:1473

vue.runtime.esm.js:4605 [Vue warn]: Error in render: "TypeError: Cannot read properties of undefined (reading 'matched')"

found in

---> <App> at src/App.vue

<Root>

warn @ vue.runtime.esm.js:4605

logError @ vue.runtime.esm.js:3045

globalHandleError @ vue.runtime.esm.js:3041

handleError @ vue.runtime.esm.js:3008

Vue._render @ vue.runtime.esm.js:2687

updateComponent @ vue.runtime.esm.js:3875

Watcher.get @ vue.runtime.esm.js:3446

Watcher @ vue.runtime.esm.js:3436

mountComponent @ vue.runtime.esm.js:3892

Vue.$mount @ vue.runtime.esm.js:8772

init @ vue.runtime.esm.js:4407

createComponent @ vue.runtime.esm.js:6567

createElm @ vue.runtime.esm.js:6521

patch @ vue.runtime.esm.js:7109

Vue._update @ vue.runtime.esm.js:3765

updateComponent @ vue.runtime.esm.js:3875

Watcher.get @ vue.runtime.esm.js:3446

Watcher @ vue.runtime.esm.js:3436

mountComponent @ vue.runtime.esm.js:3892

Vue.$mount @ vue.runtime.esm.js:8772

eval @ main.js:12

./src/main.js @ app.js:276

__webpack_require__ @ app.js:348

(anonymous) @ app.js:1470

__webpack_require__.O @ app.js:394

(anonymous) @ app.js:1471

(anonymous) @ app.js:1473

vue.runtime.esm.js:3049 TypeError: Cannot read properties of undefined (reading 'matched')

at render (vue-router.esm.js:354:1)

at createFunctionalComponent (vue.runtime.esm.js:4357:1)

at createComponent (vue.runtime.esm.js:4497:1)

at _createElement (vue.runtime.esm.js:2916:1)

at createElement$1 (vue.runtime.esm.js:2866:1)

at vm._c (vue.runtime.esm.js:2635:1)

at Proxy.render (App.vue:11:1)

at Vue._render (vue.runtime.esm.js:2684:1)

at VueComponent.updateComponent (vue.runtime.esm.js:3875:1)

at Watcher.get (vue.runtime.esm.js:3446:1)

logError @ vue.runtime.esm.js:3049

globalHandleError @ vue.runtime.esm.js:3041

handleError @ vue.runtime.esm.js:3008

Vue._render @ vue.runtime.esm.js:2687

updateComponent @ vue.runtime.esm.js:3875

Watcher.get @ vue.runtime.esm.js:3446

Watcher @ vue.runtime.esm.js:3436

mountComponent @ vue.runtime.esm.js:3892

Vue.$mount @ vue.runtime.esm.js:8772

init @ vue.runtime.esm.js:4407

createComponent @ vue.runtime.esm.js:6567

createElm @ vue.runtime.esm.js:6521

patch @ vue.runtime.esm.js:7109

Vue._update @ vue.runtime.esm.js:3765

updateComponent @ vue.runtime.esm.js:3875

Watcher.get @ vue.runtime.esm.js:3446

Watcher @ vue.runtime.esm.js:3436

mountComponent @ vue.runtime.esm.js:3892

Vue.$mount @ vue.runtime.esm.js:8772

eval @ main.js:12

./src/main.js @ app.js:276

__webpack_require__ @ app.js:348

(anonymous) @ app.js:1470

__webpack_require__.O @ app.js:394

(anonymous) @ app.js:1471

(anonymous) @ app.js:1473

 

 

 

[package.json]{ "name": "front", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, "dependencies": { "core-js": "^3.8.3", "vue": "^2.6.14", "vue-router": "^3.5.3", "vuex": "^3.6.2" }, "devDependencies": { "@babel/core": "^7.12.16", "@babel/eslint-parser": "^7.12.16", "@vue/cli-plugin-babel": "~5.0.0", "@vue/cli-plugin-eslint": "~5.0.0", "@vue/cli-service": "~5.0.0", "eslint": "^7.32.0", "eslint-plugin-vue": "^8.0.3", "vue-template-compiler": "^2.6.14" }, "eslintConfig": { "root": true, "env": { "node": true }, "extends": [ "plugin:vue/essential", "eslint:recommended" ], "parserOptions": { "parser": "@babel/eslint-parser" }, "rules": {} }, "browserslist": [ "> 1%", "last 2 versions", "not dead" ] }

0

인프런 AI 인턴님의 프로필

인프런 AI 인턴

2023.06.26

안녕하세요, 인프런 AI 인턴이에요.

오류 내용을 보면 ‘VueRouter’에서 ‘default’를 불러올 수 없다는 오류입니다. 보통 이런 경우는 여러 가지 원인으로 발생할 수 있는데, 현재 상황에서는 vue-router의 버전이 맞지 않아서 생기는 문제일 수 있습니다. 현재 사용하고 있는 버전은 “^4.0.13” 이며, 이 버전에 따른 VueRouter 사용 방법을 확인하셔서 사용해보시기 바랍니다.

만약 이게 원인이 아니라면 다른 원인일 수도 있으니 해당 코드를 더 자세히 살펴보시기 바랍니다. 감사합니다.