Tajuk ditulis semula sebagai: Meningkatkan keindahan ralat gelung ESLint
<p>Saya sedang mencipta komponen vue</p>
<p>Tetapi saya mendapat ralat berikut</p>
<pre class="brush:php;toolbar:false;">Anotasi jenis hanya boleh digunakan dalam fail TypeScript.</pre>
<p>Jika saya mengalih keluar klausa jenis, saya mendapat</p>
<pre class="brush:php;toolbar:false;">Tiada jenis pulangan pada fungsi.</pre>
<p>Komponen kelihatan seperti: </p>
<pre class="brush:php;toolbar:false;"><template>
<pra>Pasaran:{{ pasaran }}</pra>
</template>
<skrip>
import Pasaran daripada "./Market";
eksport lalai {
nama: Pasar,
komponen: {},
data() { //<--- isu dilaporkan di sini
kembali {
pasaran: Pasaran baharu(),
};
},
};
</script></pre>
<p>Saya rasa saya mempunyai konflik dalam konfigurasi yang lebih cantik dan eslints, jadi seseorang melihat vue sebagai TS serasi dan yang lain tidak</p>
<p>Saya telah mencuba pelbagai tweak dan perubahan tetapi setakat ini tiada perbezaan, jadi bolehkah seseorang menunjukkan saya kepada konfigurasi yang betul untuk membetulkannya?</p>
<p>tsconfig.json</p>
<pre class="brush:php;toolbar:false;">{
"compilerOptions": {
"sasaran": "seterusnya",
"modul": "seterusnya",
"ketat": benar,
"jsx": "pelihara",
"importHelpers": benar,
"moduleResolution": "nod",
"experimentalDecorators": benar,
"skipLibCheck": benar,
"esModuleInterop": benar,
"allowSyntheticDefaultImports": benar,
"sourceMap": benar,
"baseUrl": ".",
"jenis": [
"webpack-env"
],
"laluan": {
"@/*": [
"src/*"
]
},
"lib": [
"seterusnya",
"dom",
"dom.iterable",
"hos skrip"
]
},
"termasuk": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"ujian/**/*.ts",
"ujian/**/*.tsx"
],
"kecualikan": [
"node_modules"
]
}</pre>
<p>babel.config.js</p>
<pre class="brush:php;toolbar:false;">module.exports = {
pratetap: ["@vue/cli-plugin-babel/preset"],
};</pre>
<p>设置,json</p>
<pre class="brush:php;toolbar:false;">{
"editor.insertSpaces": palsu,
"editor.minimap.enabled": palsu,
"files.eol": "n",
"workbench.sideBar.location": "kanan",
"php-cs-fixer.executablePath": "${extensionPath}php-cs-fixer.phar",
"pelancaran": {
"konfigurasi": [],
"sebatian": []
},
"debug.javascript.usePreview": palsu,
"window.zoomLevel": 3,
"eslint.format.enable": benar
}</pre>
<p>package.json</p>
<pre class="brush:php;toolbar:false;">{
"kebergantungan": {
"core-js": "^3.6.5",
"vue": "^3.0.0",
"vue-class-component": "^8.0.0-0"
},
"devDependencies": {
"@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",
"lebih cantik": "^2.2.1",
"typescript": "~4.1.5"
},
"eslintConfig": {
"akar": benar,
"env": {
"nod": benar
},
"lanjutkan": [
"plugin:vue/vue3-essential",
"eslint:disyorkan",
"@vue/typescript/disyorkan",
"@vue/prettier",
"@vue/prettier/@typescript-eslint"
],
"parserOptions": {
"ecmaVersion": 2020
},
"peraturan": {}
},
"senarai pelayar": [
"> 1%",
"2 versi terakhir",
"tidak mati"
]
}</pre>
<p><br /></p>