Der Komponentenname „Temp“ sollte immer ein aus mehreren Wörtern bestehender vue/multi-word-component-names sein

Ich bin neu in der Vue.js-Technologie. Ich erhalte eine Fehlermeldung, während ich meine Vue-Anwendung ausführe. Ich weiß nicht, wo ich falsch liege, versuchen Sie bitte, meinen Fehler zu beheben.

Dies ist die temporäre Datei, in der ich einen Fehler erhalte.

Temp.vue

<template>
  <div>
    <h1>Hello Ashish</h1>
    <h2>{{name}}</h2>
  </div>
</template>

<script>
export default {
  name: "Temp",
};
</script>

App.vue

<template>
  <img alt="Vue logo" src="./assets/logo.png">
  <HelloWorld msg="Welcome to Your Vue.js App"/>
  <!-- <HomeComp msg="Hello Harshal"/> -->
  <!-- <ForLoop/> -->
  <Temp/>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'
// import HomeComp from './components/HomeComp.vue';
// import ForLoop from './components/ForLoop.vue';
import Temp from './components/Temp.vue';


export default {
  name: 'App',
  components: {
    HelloWorld,
    // HomeComp,
    // ForLoop
    // Demo,
    Temp
  }
}
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

Fügen Sie dies dem Abschnitt “Regeln” in eslintrc.js hinzu, wenn Sie die Komponentennamen nicht ändern möchten:

'vue/multi-word-component-names': 'off', 

(Aus der obigen Antwort von @lifecoder entnommen, kann es aber aufgrund meines Rufs nicht als Kommentar hinzufügen)

Ihr Linter sagt Ihnen nur, dass Ihr Komponentenname aus mehreren Wörtern bestehen sollte MeineTemp statt nur Temp.

Sie könnten die Komponente umbenennen oder die Linting-Regel deaktivieren.

Hinzufügen "rules": {"vue/multi-word-component-names": "off"} zu eslintConfig in package.json

Es gibt mehrere Dinge, die Sie tun können, um zu helfen:

1. Um zwei Hochwasser zu nennen
2. Dass Sie diesen Code zu Ihrem Projekt hinzufügen können:

{
   "vue/multi-word-component-names": ["error", {
      "ignores": []
   }]
}

Schauen Sie sich unbedingt das vollständige Dokument an Diese Seite.

Also stoße ich auch auf den gleichen Fehler. Alles, was Sie tun müssen, ist, den Namen der Komponente von Temp in MyTemp oder eine andere Kombination aus zwei Wörtern zu ändern.

Hier können Sie auch die Idee aus der vue/multi-word-component-names-Dokumentation sehen und übernehmen. Sie haben die Dinge sehr klar erklärt und sind sehr hilfreich: –

https://eslint.vuejs.org/rules/multi-word-component-names.html

Gehen Sie zur Datei vue.config.js

const { defineConfig } = require('@vue/cli-service')
  module.exports = defineConfig({
  transpileDependencies: true,
  // Add this line of code to disable lintOnSave
  lintOnSave: false
})

Verwenden Sie einfach einen aus mehreren Wörtern bestehenden Namen wie “MyCounters”, nicht nur “Counter”.

export default {
  name: "MeusContadores",
  components: {
    "app-contador": MeuContador,
  },
};