Skip to content

vue/no-unused-vars needs configuration options similar to eslint/no-unused-vars #294

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
Phlow2001 opened this issue Dec 19, 2017 · 8 comments

Comments

@Phlow2001
Copy link

Tell us about your environment

  • ESLint Version: v4.13.1
  • eslint-plugin-vue Version: eslint-plugin-vue@^4.0.0-beta.2
  • Node Version: v8.4.0

Please show your full configuration:

{
    "env": {
        "browser": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:vue/recommended"
    ],
    "parserOptions": {
        "sourceType": "module"
    },
    "rules": {
        "indent": [
            "error",
            4,
            {
                "SwitchCase": 1
            }
        ],
        "linebreak-style": [
            "error",
            "windows"
        ],
        "quotes": [
            "error",
            "double",
            {
                "avoidEscape": true,
                "allowTemplateLiterals": true
            }
        ],
        "semi": [
            "error",
            "always"
        ],
        "no-console": [
            "off"
        ],
        "no-unused-vars": [
            "error",
            {
                "args": "after-used",
                "argsIgnorePattern": "^_"
            }
        ],
        "vue/html-self-closing": "off",
        "vue/html-indent": [
            "error", 
            4
        ],
        "vue/max-attributes-per-line": "off",
        "vue/order-in-components": "off"
    }
}

What did you do? Please include the actual source code causing the issue.

<template>
<div id="app">
      <div v-for="(thing, key, index) in things" :key="thing.id" :class="{ 'every-other': index % 2 === 0 }">
        {{ thing.id }} - {{ index }}
      </div>
</div>
</template>
<style>
.every-other {
  background-color: red;
}

div {
  width: 100px;
}
</style>
<script>
new Vue({
  el: '#app',
  data: () => ({
    things:  {
      thing1: { id: "thing 1" },
      thing2: { id: "thing 2" },
      thing3: { id: "thing 3" },
      thing4: { id: "thing 4" },
      thing5: { id: "thing 5" },
      thing6: { id: "thing 6" }
    }
  })
})
</script>

What did you expect to happen?
v-for supports optional 2nd and 3rd params, and it's not unexpected that the 2nd param would be unused. eslint/no-unused-vars allows for configurations that take this into account, such as in my config:

        "no-unused-vars": [
            "error",
            {
                "args": "after-used",
                "argsIgnorePattern": "^_"
            }
        ],

What actually happened? Please include the actual, raw output from ESLint.
The 'key' variable is unused and therefore causes an error.
[eslint-plugin-vue] [vue/no-unused-vars] 'key' is defined but never used.

@michalsnik
Copy link
Member

Hey @Phlow2001. Thanks for posting this proposition. I very much agree with you, it's a valid point. Though I think that for the sake of Vue DSL it should be enough if we only implement "after-used" and make this a default behaviour of this rule. So we would simply ignore all properties but last. What do you think?

@Phlow2001
Copy link
Author

I think that's reasonable. If someone has a valid need for more they can submit an issue at that point.

@michalsnik
Copy link
Member

Cool, then I'm going to work on this now :)

@sangdth
Copy link

sangdth commented Feb 5, 2019

When I work with Element UI, they have template with scope that I never use, but Element will not work without it. So I need options to put at least, scope variable name into exception.

<template slot="header" slot-scope="scope">
    Custom header, never touches the scope.
</template>

@rachel-flux
Copy link

I agree with @sangdth -- running into this same issue with slot-scope.

@AndreyRavkov
Copy link

AndreyRavkov commented Sep 24, 2019

@sangdth , @rachel-flux
I got the same issue with slot-scope

Now i disabled this rule with using {} instead scope
<template slot="HEAD_Status" slot-scope="{}"> </template>

@cn1001wang
Copy link

"no-unused-vars": [ "error", { "args": "after-used", "argsIgnorePattern": "^_" } ],
but Currently, only "off", "warn", "error" are supported,can't support RegExp. Or I didn't use it correctly

@ota-meshi
Copy link
Member

Hi.

We plan to add option to vue/no-unused-vars rule.

https://github.com/vuejs/eslint-plugin-vue/pull/1070/files#diff-771e0befcf053e5a67a7c1c6ca67956e

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

7 participants