Titel umgeschrieben als: Verbesserung der Sch?nheit von ESLint-Schleifenfehlern
P粉010967136
2023-08-25 12:50:19
<p>Ich erstelle eine Vue-Komponente</p>
<p>Aber ich erhalte die folgende Fehlermeldung</p>
<pre class="brush:php;toolbar:false;">Typanmerkungen k?nnen nur in TypeScript-Dateien verwendet werden.</pre>
<p>Wenn ich die Typklausel entferne, erhalte ich </p>
<pre class="brush:php;toolbar:false;">Fehlender Rückgabetyp für Funktion.</pre>
<p>Die Komponente sieht so aus: </p>
<pre class="brush:php;toolbar:false;"><template>
<pre>Market:{{ market }}</pre>
</template>
<script>
Importieren Sie den Markt aus ?./Market“;
Standard exportieren {
Name: Markt,
Komponenten: {},
data() { //<--- Problem wird hier gemeldet
zurückkehren {
Markt: neuer Markt(),
};
},
};
</script></pre>
<p>Ich sch?tze, ich habe einen Konflikt in den Prettier- und Eslints-Konfigurationen, also sieht der eine Vue als TS-kompatibel an und der andere nicht</p>
<p>Ich habe verschiedene Optimierungen und ?nderungen ausprobiert, aber bisher keinen Unterschied. Kann mir also jemand die richtige Konfiguration nennen, um das Problem zu beheben?</p>
<p>tsconfig.json</p>
<pre class="brush:php;toolbar:false;">{
?compilerOptions“: {
?target“: ?esnext“,
?module“: ?esnext“,
?streng“: wahr,
?jsx“: ?bewahren“,
?importHelpers“: wahr,
?moduleResolution“: ?node“,
?experimentalDecorators“: wahr,
?skipLibCheck“: wahr,
?esModuleInterop“: true,
?allowSyntheticDefaultImports“: true,
?sourceMap“: wahr,
?baseUrl“: ?.“,
"Typen": [
?webpack-env“
],
"Pfade": {
"@/*": [
?src/*“
]
},
"lib": [
?esnext“,
?dom“,
?dom.iterable“,
"Script host"
]
},
"enthalten": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
?ausschlie?en“: [
?node_modules“
]
}</pre>
<p>babel.config.js</p>
<pre class="brush:php;toolbar:false;">module.exports = {
Voreinstellungen: ["@vue/cli-plugin-babel/preset"],
};</pre>
<p>設(shè)置,json</p>
<pre class="brush:php;toolbar:false;">{
?editor.insertSpaces“: false,
?editor.minimap.enabled“: false,
?files.eol“: ?n“,
?workbench.sideBar.location“: ?rechts“,
?php-cs-fixer.executablePath“: ?${extensionPath}php-cs-fixer.phar“,
"Start": {
"Konfigurationen": [],
?Verbindungen“: []
},
?debug.javascript.usePreview“: false,
"window.zoomLevel": 3,
?eslint.format.enable“: wahr
}</pre>
<p>package.json</p>
<pre class="brush:php;toolbar:false;">{
"Abh?ngigkeiten": {
?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“,
"prettier": "^2.2.1",
?typescript“: ?~4.1.5“
},
"eslintConfig": {
?root“: wahr,
?env“: {
?Knoten“: wahr
},
"erweitert": [
?plugin:vue/vue3-essential“,
?eslint:empfohlen“,
?@vue/typescript/recommended“,
?@vue/prettier“,
?@vue/prettier/@typescript-eslint“
],
"parserOptions": {
?ecmaVersion“: 2020
},
"Regeln": {}
},
"Browserliste": [
?> 1 %“,
?letzte 2 Versionen“,
"nicht tot"
]
}</pre>
<p><br /></p>
我之前也遇到了同樣的問題,用以下代碼修復(fù):
<script lang="ts">
...
</script>
如果對你有用,請告訴我。
Wie +0
P粉010967136