-
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
nom run serve를 하면 오류가 납니다.
22.03.16 14:54 작성 조회수 499
2
vue-advancded의 vue-news에 있는 파일을 새로 만든 news의 디렉토리로 옮기고
npm run serve를 실행하면
아래처럼 routes/index.js와 store/index.js를 찾을 수 없다는 오류가 납니다.
모두 파일은 위치해 있지만 이렇게 됩니다.
어떻게 해결해야 하는지 좀 알려 주세요.
webpack compiled with 1 error
ERROR in src/main.ts:3:20
TS7016: Could not find a declaration file for module './routes/index.js'. '/Users/jungkyungsuk/Workspaces/inflearn/learn-vue-typescript/vue-news/src/routes/index.js' implicitly has an 'any' type.
1 | import Vue from "vue";
2 | import App from "./App.vue";
> 3 | import router from "./routes/index.js";
| ^^^^^^^^^^^^^^^^^^^
4 | import store from "./store/index.js";
5 |
6 | Vue.config.productionTip = false;
ERROR in src/main.ts:4:19
TS7016: Could not find a declaration file for module './store/index.js'. '/Users/jungkyungsuk/Workspaces/inflearn/learn-vue-typescript/vue-news/src/store/index.js' implicitly has an 'any' type.
2 | import App from "./App.vue";
3 | import router from "./routes/index.js";
> 4 | import store from "./store/index.js";
| ^^^^^^^^^^^^^^^^^^
5 |
6 | Vue.config.productionTip = false;
7 |
답변을 작성해보세요.
1
장기효(캡틴판교)
지식공유자2022.03.16
안녕하세요 경석님, package.json 파일의 vue 관련 라이브러리 버전 적어주시겠어요? router와 vuex 버전을 아래 글에 나온 것과 같이 맞춰주셔야 합니다. 그리고 타입 선언 파일을 찾을 수 없다고 나오는 것은 뷰 설정 파일에서 overlay 옵션을 꺼주시면 됩니다.
https://joshua1988.github.io/web-development/vuejs/vue3-as-default/
jung kyung-suk
질문자2022.03.18
{
"name": "vue-news",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.26.1",
"core-js": "^3.8.3",
"vue": "^2.6.14",
"vue-router": "^3.5.3",
"vuex": "^3.6.2"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-plugin-typescript": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"@vue/eslint-config-typescript": "^9.1.0",
"eslint": "^7.32.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-vue": "^8.0.3",
"prettier": "^2.4.1",
"typescript": "~4.5.5",
"vue-template-compiler": "^2.6.14"
}
버전알려주신 페이지 처럼 맞췄는데도, 아래와 같이 나오고 있습니다. 제가 에러 부분을 빼먹은게 있어서 더
넣었습니다.
webpack compiled with 1 error
ERROR in src/main.ts:3:20
TS7016: Could not find a declaration file for module './routes/index.js'. '/Users/jungkyungsuk/Workspaces/inflearn/learn-vue-typescript/vue-news/src/routes/index.js' implicitly has an 'any' type.
1 | import Vue from "vue";
2 | import App from "./App.vue";
> 3 | import router from "./routes/index.js";
| ^^^^^^^^^^^^^^^^^^^
4 | import store from "./store/index.js";
5 |
6 | Vue.config.productionTip = false;
ERROR in src/main.ts:4:19
TS7016: Could not find a declaration file for module './store/index.js'. '/Users/jungkyungsuk/Workspaces/inflearn/learn-vue-typescript/vue-news/src/store/index.js' implicitly has an 'any' type.
2 | import App from "./App.vue";
3 | import router from "./routes/index.js";
> 4 | import store from "./store/index.js";
| ^^^^^^^^^^^^^^^^^^
5 |
6 | Vue.config.productionTip = false;
7 |
ERROR in src/main.ts:9:3
TS2769: No overload matches this call.
Overload 1 of 3, '(options?: ThisTypedComponentOptionsWithArrayProps<Vue, object, object, object, never> | undefined): CombinedVueInstance<Vue, object, object, object, Record<...>>', gave the following error.
Argument of type '{ router: any; store: any; render: (h: CreateElement) => VNode; }' is not assignable to parameter of type 'ThisTypedComponentOptionsWithArrayProps<Vue, object, object, object, never>'.
Object literal may only specify known properties, and 'router' does not exist in type 'ThisTypedComponentOptionsWithArrayProps<Vue, object, object, object, never>'.
Overload 2 of 3, '(options?: ThisTypedComponentOptionsWithRecordProps<Vue, object, object, object, object> | undefined): CombinedVueInstance<Vue, object, object, object, Record<...>>', gave the following error.
Argument of type '{ router: any; store: any; render: (h: CreateElement) => VNode; }' is not assignable to parameter of type 'ThisTypedComponentOptionsWithRecordProps<Vue, object, object, object, object>'.
Object literal may only specify known properties, and 'router' does not exist in type 'ThisTypedComponentOptionsWithRecordProps<Vue, object, object, object, object>'.
Overload 3 of 3, '(options?: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<DefaultProps>, DefaultProps> | undefined): CombinedVueInstance<...>', gave the following error.
Argument of type '{ router: any; store: any; render: (h: CreateElement) => VNode; }' is not assignable to parameter of type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<DefaultProps>, DefaultProps>'.
Object literal may only specify known properties, and 'router' does not exist in type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<DefaultProps>, DefaultProps>'.
7 |
8 | new Vue({
> 9 | router,
| ^^^^^^
10 | store,
11 | render: (h) => h(App),
12 | }).$mount("#app");
Yong-Hae Lee
2022.03.19
저도 같은 문제가 있습니다. (사용하는 버전을 동일해서 같은 에러가 발생하는 것 같습니다.)
의견: 에러가 브라우저에 에러 화면이 보이는 것을 감추는 방법을 알려주시는 것도 방법일 것 같아요. 화면에 에러가 보이니까 진행할 수 없다고 생각 할 수 있으니까요.
@jung kyung-suk님, 에러 오버레이를 무시하시고 다음 챕터로 넘어가 주세요. tsconfig를 통해서 에러를 해결하는 방법을 알려줍니다.
jung kyung-suk
질문자2022.03.21
안녕하세요.
오버레이는 무시하더라도 router/index.js 와 store/index.js 문제로 serve 실행자체가 안되요
Yong-Hae Lee
2022.03.21
저 같은 경우는 브라우저 화면 우측 상단에 "X"표시가 있어 "X"를 클릭하여 닫았었습니다. (이 것을 무시한다고 표현했었습니다.)
바로 다음 강의에서 router/index.js와 store/index.js와 관련된 error를 없애는 방법이 나오는데, 요약하면 tsconfig.json에서 "compilerOptions"아래에 아래의 3개 option을 넣어보세요.
장기효(캡틴판교)
지식공유자2022.03.21
안녕하세요, 현재 상황에서는 타입 선언 파일을 찾을 수 없다는 에러가 나오는게 맞습니다. 제 이전 답변이 잘못됐네요. 일단 용해님 말씀처럼 뷰 설정 파일에 overlay 옵션을 꺼주시고 실행하시면 문제 없이 화면 동작하는거 보실 수 있을 거예요.
뷰 설정 파일에 아래와 같이 오버레이 옵션 끄는거 넣으시면 됩니다.
답변 1