如何解决“错误'Vote'已定义但从未使用（no-unused-vars）”的问题？

Question

can you help me?.I'm getting error when i will to import file Vote.And errors that appear like 'Vote' is defined but never used ( no-unused-vars).I tried to rename the Vote file and he result are nill.

Home.vue
import Vote from "@/components/Vote.vue";
export default {
name: "Home",
components: { Vote }
};

Vote.vue
<script> // @ is an alias to /src //import HelloWorld from "@/components/HelloWorld.vue";
export default {
name: "Vote",
components: {},
data: function(){
return{ emoticons : ['calon-1','calon-2','calon-3','calon-4'] }

  }
};

Answer 1

sounds like a linting notice. https://eslint.org/docs/rules/no-unused-vars .

To solve this you should use your <Vote/> component somewhere in your Home.vue HTML.

I am pretty sure that your linting rules want to have a component registration with a component use inside your HTML. That means a simple import wont solve this, because a import is not a "using". Do you work with the Vue-CLI? if yes, which lint rule set do you use? you can disable not needed rules in your Webpack config.

And to find your webpack.config.js we need to know which kind of settings you did in your setup CLI process.

Check your: package.json file in your root directory, is there something like esLint except the npm dependencies in there?

if not then you can create a new file in your root called .eslintrc.js and inside you paste this:

module.exports = {
  root: true,
  rules: {
    "no-unused-vars": "off"
  },
};

this will fix your problem but imho you should not disable such rules, they help you to clean code

Answer 2

Vote is a variable(or class). you defined it as a string here. Please change

name: "Vote"

to

name: Vote