vue 컴포넌트를 생성 중입니다
하지만 다음과 같은 오류가 발생합니다
유형 주석은 TypeScript 파일에서만 사용할 수 있습니다.
type 절을 제거하면
함수에 반환 유형이 누락되었습니다.
구성요소는 다음과 같습니다.
<템플릿> <사전>시장:{{ 시장 }}템플릿> <스크립트> "./Market"에서 시장을 가져옵니다. 기본값 내보내기 { 이름: 시장, 구성 요소: {}, data() { //<--- 문제가 여기에 보고됩니다. 반품 { 시장: 새로운 시장(), }; }, };
prettier와 eslints 구성에 충돌이 있는 것 같아서 한 쪽은 vue를 TS 호환으로 보고 다른 쪽은 그렇지 않다고 봅니다
다양한 조정과 변경을 시도했지만 지금까지 아무런 차이가 없습니다. 누구든지 이 문제를 해결하기 위해 올바른 구성을 알려줄 수 있습니까?
tsconfig.json
{ "컴파일러 옵션": { "대상": "esnext", "모듈": "esnext", "엄격한": 사실, "jsx": "보존", "importHelpers": 사실, "moduleResolution": "노드", "experimentalDecorators": 사실, "skipLibCheck": 사실, "esModuleInterop": 사실, "allowSyntheticDefaultImports": 사실, "sourceMap": 사실, "baseUrl": ".", "유형": [ "웹팩 환경" ], "경로": { "@/*": [ "src/*" ] }, "lib": [ "다음", "돔", "dom.iterable", "스크립트 호스트" ] }, "포함하다": [ "src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "테스트/**/*.ts", "테스트/**/*.tsx" ], "제외": [ "노드_모듈" ] }
babel.config.js
module.exports = { 사전 설정: ["@vue/cli-plugin-babel/preset"], };
设置,json
{ "editor.insertSpaces": 거짓, "editor.minimap.enabled": 거짓, "files.eol": "n", "workbench.sideBar.location": "오른쪽", "php-cs-fixer.executablePath": "${extensionPath}php-cs-fixer.phar", "시작하다": { "구성": [], "화합물": [] }, "debug.javascript.usePreview": 거짓, "window.zoom레벨": 3, "eslint.format.enable": 사실 }
package.json
{ "종속성": { "core-js": "^3.6.5", "vue": "^3.0.0", "vue-class-컴포넌트": "^8.0.0-0" }, "devDependency": { "@typescript-eslint/eslint-plugin": "^4.18.0", "@typescript-eslint/parser": "^4.18.0", "@vue/cli-plugin-babel": "~4.5.0", "@vue/cli-plugin-eslint": "~4.5.0", "@vue/cli-plugin-typescript": "~4.5.0", "@vue/cli-service": "~4.5.0", "@vue/compiler-sfc": "^3.0.0", "@vue/eslint-config-prettier": "^6.0.0", "@vue/eslint-config-typescript": "^7.0.0", "에슬린트": "^6.7.2", "eslint-plugin-prettier": "^3.3.1", "eslint-plugin-vue": "^7.0.0", "더 예뻐요": "^2.2.1", "typescript": "~4.1.5" }, "eslintConfig": { "루트": 사실, "환경": { "노드": 참 }, "확장": [ "플러그인:vue/vue3-필수", "eslint:권장", "@vue/typescript/권장", "@vue/예뻐요", "@vue/prettier/@typescript-eslint" ], "파서 옵션": { "ecma버전": 2020 }, "규칙": {} }, "브라우저 목록": [ "> 1%", "최근 2개 버전", "죽지 않았다" ] }
이전에 같은 문제가 발생하여 다음 코드로 해결했습니다.
으아악이 방법이 효과가 있다면 알려주세요.