vue コンポーネントを作成しています
しかし、次のエラーが表示されます
型アノテーションは TypeScript ファイルでのみ使用できます。
type 句を削除すると、
が返されます。関数の戻り値の型がありません。
コンポーネントは次のようになります:
<テンプレート>マーケット:{{ マーケット }}テンプレート> <スクリプト> マーケットを「./Market」からインポートします。 デフォルトのエクスポート { 名前: マーケット、 コンポーネント: {}、 data() { //<--- 問題はここで報告されています 戻る { マーケット: 新しいマーケット()、 }; }、 };
prettier 構成と eslints 構成に競合があると思われます。そのため、一方は vue を TS 互換とみなし、もう一方はそうでないと考えます。
さまざまな調整や変更を試しましたが、今のところ違いはありません。誰かがこれを修正するための正しい構成を教えてもらえますか?
tsconfig.json
{ "コンパイラーオプション": { "ターゲット": "エスネクスト", "モジュール": "エスネクスト", "厳密": true、 "jsx": "保存", "importHelpers": true、 "モジュール解像度": "ノード", "experimentalDecorators": true、 "skipLibCheck": true、 "esModuleInterop": true、 "allowSyntheticDefaultImports": true、 "sourceMap": true、 "baseUrl": ".", "種類": [ 「webpack-env」 ]、 「パス」: { "@/*": [ "src/*" 】 }、 "ライブラリ": [ 「エスネクスト」、 「ドム」、 "dom.iterable", 「スクリプトホスト」 】 }、 "含む": [ "src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", 「テスト/**/*.ts", 「テスト/**/*.tsx」 ]、 「除外」: [ 「ノードモジュール」 】 }
babel.config.js
module.exports = { プリセット: ["@vue/cli-plugin-babel/preset"], };
設置、json
{ "editor.insertSpaces": false、 "editor.minimap.enabled": false、 "files.eol": "n", "workbench.sideBar.location": "右", "php-cs-fixer.executablePath": "${extensionPath}\php-cs-fixer.phar", "打ち上げ": { 「設定」: [], 「化合物」: [] }、 "debug.javascript.usePreview": false、 "window.zoomLevel": 3、 "eslint.format.enable": true }
package.json
{ "依存関係": { "core-js": "^3.6.5", "vue": "^3.0.0", "vue-クラス-コンポーネント": "^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", "eslint": "^6.7.2", "eslint-plugin-prettier": "^3.3.1", "eslint-plugin-vue": "^7.0.0", "よりきれい": "^2.2.1", "タイプスクリプト": "~4.1.5" }、 "eslintConfig": { "ルート": true、 "環境": { 「ノード」: true }、 「拡張する」: [ "プラグイン:vue/vue3-essential", "eslint: 推奨", "@vue/typescript/推奨", "@vue/prettier", 「@vue/prettier/@typescript-eslint」 ]、 "parserOptions": { 「ecmaバージョン」: 2020 }、 「ルール」: {} }、 "ブラウザリスト": [ "> 1%"、 "最後の 2 つのバージョン", "死んでいません" 】 }
私も以前に同じ問題に遭遇し、次のコードで修正しました:
リーリーそれがあなたにとって役立つ場合は、教えてください。