From 1d73fdaf96aacbfeafea8f756a84642e9bb5ce6a Mon Sep 17 00:00:00 2001
From: IWANABETHATGUY <974153916@qq.com>
Date: Sun, 8 Mar 2020 11:40:48 +0800
Subject: [PATCH 1/4] feat: add fixable, no more error when unused variable
 with prefix _

implement proposal https://github.com/vuejs/eslint-plugin-vue/issues/1058

feat https://github.com/vuejs/eslint-plugin-vue/issues/1058
---
 docs/rules/README.md              |  2 +-
 docs/rules/no-unused-vars.md      |  3 ++-
 lib/rules/no-unused-vars.js       |  9 ++++---
 tests/lib/rules/no-unused-vars.js | 41 ++++++++++++++++++++++---------
 4 files changed, 39 insertions(+), 16 deletions(-)

diff --git a/docs/rules/README.md b/docs/rules/README.md
index ab1f5b220..308a10de0 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -48,7 +48,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/no-template-key](./no-template-key.md) | disallow `key` attribute on `<template>` |  |
 | [vue/no-textarea-mustache](./no-textarea-mustache.md) | disallow mustaches in `<textarea>` |  |
 | [vue/no-unused-components](./no-unused-components.md) | disallow registering components that are not used inside templates |  |
-| [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |  |
+| [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes | :wrench: |
 | [vue/no-use-v-if-with-v-for](./no-use-v-if-with-v-for.md) | disallow use v-if on the same element as v-for |  |
 | [vue/require-component-is](./require-component-is.md) | require `v-bind:is` of `<component>` elements |  |
 | [vue/require-prop-type-constructor](./require-prop-type-constructor.md) | require prop type to be a constructor | :wrench: |
diff --git a/docs/rules/no-unused-vars.md b/docs/rules/no-unused-vars.md
index cde104f4f..a6f9205f8 100644
--- a/docs/rules/no-unused-vars.md
+++ b/docs/rules/no-unused-vars.md
@@ -8,12 +8,13 @@ description: disallow unused variable definitions of v-for directives or scope a
 > disallow unused variable definitions of v-for directives or scope attributes
 
 - :gear: This rule is included in all of `"plugin:vue/essential"`, `"plugin:vue/strongly-recommended"` and `"plugin:vue/recommended"`.
+- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
 
 ## :book: Rule Details
 
 This rule report variable definitions of v-for directives or scope attributes if those are not used.
 
-<eslint-code-block :rules="{'vue/no-unused-vars': ['error']}">
+<eslint-code-block fix :rules="{'vue/no-unused-vars': ['error']}">
 
 ```vue
 <template>
diff --git a/lib/rules/no-unused-vars.js b/lib/rules/no-unused-vars.js
index 205531f31..362d85f97 100644
--- a/lib/rules/no-unused-vars.js
+++ b/lib/rules/no-unused-vars.js
@@ -18,7 +18,7 @@ module.exports = {
       category: 'essential',
       url: 'https://eslint.vuejs.org/rules/no-unused-vars.html'
     },
-    fixable: null,
+    fixable: 'code',
     schema: []
   },
 
@@ -29,15 +29,18 @@ module.exports = {
 
         for (
           let i = variables.length - 1;
-          i >= 0 && !variables[i].references.length;
+          i >= 0 && !variables[i].id.name.startsWith('_') && !variables[i].references.length;
           i--
         ) {
           const variable = variables[i]
+          const [start, end] = variable.id.range
           context.report({
             node: variable.id,
             loc: variable.id.loc,
             message: `'{{name}}' is defined but never used.`,
-            data: variable.id
+            data: variable.id,
+            fix: (fixer) =>
+              fixer.replaceTextRange([start, end], `_${variable.id.name}`)
           })
         }
       }
diff --git a/tests/lib/rules/no-unused-vars.js b/tests/lib/rules/no-unused-vars.js
index 09cfde9fc..869798451 100644
--- a/tests/lib/rules/no-unused-vars.js
+++ b/tests/lib/rules/no-unused-vars.js
@@ -52,52 +52,71 @@ tester.run('no-unused-vars', rule, {
     },
     {
       code: '<template><div v-for="x in foo" :[x]></div></template>'
+    },
+    {
+      code: '<template><div v-for="_ in foo" ></div></template>'
+    },
+    {
+      code: '<template><div v-for="_i in foo" ></div></template>'
     }
   ],
   invalid: [
     {
       code: '<template><ol v-for="i in 5"><li></li></ol></template>',
-      errors: ["'i' is defined but never used."]
+      errors: ["'i' is defined but never used."],
+      output: '<template><ol v-for="_i in 5"><li></li></ol></template>'
     },
     {
       code: '<template><template scope="props"></template></template>',
-      errors: ["'props' is defined but never used."]
+      errors: ["'props' is defined but never used."],
+      output: '<template><template scope="_props"></template></template>'
     },
     {
       code: '<template><span slot-scope="props"></span></template>',
-      errors: ["'props' is defined but never used."]
+      errors: ["'props' is defined but never used."],
+      output: '<template><span slot-scope="_props"></span></template>'
     },
     {
       code: '<template><span><template scope="props"></template></span></template>',
-      errors: ["'props' is defined but never used."]
+      errors: ["'props' is defined but never used."],
+      output: '<template><span><template scope="_props"></template></span></template>'
     },
     {
       code: '<template><div v-for="i in 5"><comp v-for="j in 10">{{i}}{{i}}</comp></div></template>',
-      errors: ["'j' is defined but never used."]
+      errors: ["'j' is defined but never used."],
+      output: '<template><div v-for="i in 5"><comp v-for="_j in 10">{{i}}{{i}}</comp></div></template>'
     },
     {
       code: '<template><ol v-for="i in data"><li v-for="f in i"></li></ol></template>',
-      errors: ["'f' is defined but never used."]
+      errors: ["'f' is defined but never used."],
+      output: '<template><ol v-for="i in data"><li v-for="_f in i"></li></ol></template>'
     },
     {
       code: '<template><div v-for="(a, b, c) in foo"></div></template>',
-      errors: ["'a' is defined but never used.", "'b' is defined but never used.", "'c' is defined but never used."]
+      errors: ["'a' is defined but never used.", "'b' is defined but never used.", "'c' is defined but never used."],
+      output: '<template><div v-for="(_a, _b, _c) in foo"></div></template>'
+
     },
     {
       code: '<template><div v-for="(a, b, c) in foo">{{a}}</div></template>',
-      errors: ["'b' is defined but never used.", "'c' is defined but never used."]
+      errors: ["'b' is defined but never used.", "'c' is defined but never used."],
+      output: '<template><div v-for="(a, _b, _c) in foo">{{a}}</div></template>'
     },
     {
       code: '<template><div v-for="(a, b, c) in foo">{{b}}</div></template>',
-      errors: ["'c' is defined but never used."]
+      errors: ["'c' is defined but never used."],
+      output: '<template><div v-for="(a, b, _c) in foo">{{b}}</div></template>'
     },
     {
       code: '<template><div v-for="(item, key) in items" :key="item.id">{{item.name}}</div></template>',
-      errors: ["'key' is defined but never used."]
+      errors: ["'key' is defined but never used."],
+      output: '<template><div v-for="(item, _key) in items" :key="item.id">{{item.name}}</div></template>'
     },
     {
       code: '<template><div v-for="x in items">{{value | x}}</div></template>',
-      errors: ["'x' is defined but never used."]
+      errors: ["'x' is defined but never used."],
+      output: '<template><div v-for="_x in items">{{value | x}}</div></template>'
+
     }
   ]
 })

From 060c9bb0000b06ae4e925076c8389ee855d182ff Mon Sep 17 00:00:00 2001
From: IWANABETHATGUY <974153916@qq.com>
Date: Sun, 8 Mar 2020 22:24:20 +0800
Subject: [PATCH 2/4] fix: make fix optional,add varIgnorePattern

---
 lib/rules/no-unused-vars.js       | 30 ++++++++++++---
 tests/lib/rules/no-unused-vars.js | 61 +++++++++++++++++++------------
 2 files changed, 62 insertions(+), 29 deletions(-)

diff --git a/lib/rules/no-unused-vars.js b/lib/rules/no-unused-vars.js
index 362d85f97..aa31a6b90 100644
--- a/lib/rules/no-unused-vars.js
+++ b/lib/rules/no-unused-vars.js
@@ -19,28 +19,48 @@ module.exports = {
       url: 'https://eslint.vuejs.org/rules/no-unused-vars.html'
     },
     fixable: 'code',
-    schema: []
+    schema: [
+      {
+        'type': 'object',
+        'properties': {
+          'varIgnorePattern': {
+            'type': 'string'
+          }
+        },
+        'additionalProperties': false
+      }
+    ]
   },
 
   create (context) {
+    const option = context.options[0] || { varIgnorePattern: '^_' }
+    const pattern = option['varIgnorePattern'] || '^_'
+    // only use for construct a regularExpression
+    // eslint-disable-next-line no-eval
+    const regExp = eval(`/${pattern}/`)
     return utils.defineTemplateBodyVisitor(context, {
       VElement (node) {
         const variables = node.variables
 
         for (
           let i = variables.length - 1;
-          i >= 0 && !variables[i].id.name.startsWith('_') && !variables[i].references.length;
+          i >= 0 && !regExp.test(variables[i].id.name) && !variables[i].references.length;
           i--
         ) {
           const variable = variables[i]
-          const [start, end] = variable.id.range
           context.report({
             node: variable.id,
             loc: variable.id.loc,
             message: `'{{name}}' is defined but never used.`,
             data: variable.id,
-            fix: (fixer) =>
-              fixer.replaceTextRange([start, end], `_${variable.id.name}`)
+            suggest: [
+              {
+                desc: 'Replace the unused-var with default ignore pattern',
+                fix: function (fixer) {
+                  return fixer.replaceText(variable.id, `_${variable.id.name}`)
+                }
+              }
+            ]
           })
         }
       }
diff --git a/tests/lib/rules/no-unused-vars.js b/tests/lib/rules/no-unused-vars.js
index 869798451..3038c2797 100644
--- a/tests/lib/rules/no-unused-vars.js
+++ b/tests/lib/rules/no-unused-vars.js
@@ -54,69 +54,82 @@ tester.run('no-unused-vars', rule, {
       code: '<template><div v-for="x in foo" :[x]></div></template>'
     },
     {
-      code: '<template><div v-for="_ in foo" ></div></template>'
+      code: '<template><div v-for="_ in foo" ></div></template>',
+      options: [{ varIgnorePattern: '^_' }]
+
     },
     {
       code: '<template><div v-for="_i in foo" ></div></template>'
+    },
+    {
+      code: '<template><div v-for="ignorei in foo" ></div></template>',
+      options: [{ varIgnorePattern: '^ignore' }]
+    },
+    {
+      code: '<template><div v-for="thisisignore in foo" ></div></template>',
+      options: [{ varIgnorePattern: 'ignore$' }]
     }
   ],
   invalid: [
     {
       code: '<template><ol v-for="i in 5"><li></li></ol></template>',
-      errors: ["'i' is defined but never used."],
-      output: '<template><ol v-for="_i in 5"><li></li></ol></template>'
+      errors: ["'i' is defined but never used."]
     },
     {
       code: '<template><template scope="props"></template></template>',
-      errors: ["'props' is defined but never used."],
-      output: '<template><template scope="_props"></template></template>'
+      errors: ["'props' is defined but never used."]
     },
     {
       code: '<template><span slot-scope="props"></span></template>',
-      errors: ["'props' is defined but never used."],
-      output: '<template><span slot-scope="_props"></span></template>'
+      errors: ["'props' is defined but never used."]
     },
     {
       code: '<template><span><template scope="props"></template></span></template>',
-      errors: ["'props' is defined but never used."],
-      output: '<template><span><template scope="_props"></template></span></template>'
+      errors: ["'props' is defined but never used."]
     },
     {
       code: '<template><div v-for="i in 5"><comp v-for="j in 10">{{i}}{{i}}</comp></div></template>',
-      errors: ["'j' is defined but never used."],
-      output: '<template><div v-for="i in 5"><comp v-for="_j in 10">{{i}}{{i}}</comp></div></template>'
+      errors: ["'j' is defined but never used."]
     },
     {
       code: '<template><ol v-for="i in data"><li v-for="f in i"></li></ol></template>',
-      errors: ["'f' is defined but never used."],
-      output: '<template><ol v-for="i in data"><li v-for="_f in i"></li></ol></template>'
+      errors: ["'f' is defined but never used."]
     },
     {
       code: '<template><div v-for="(a, b, c) in foo"></div></template>',
-      errors: ["'a' is defined but never used.", "'b' is defined but never used.", "'c' is defined but never used."],
-      output: '<template><div v-for="(_a, _b, _c) in foo"></div></template>'
+      errors: ["'a' is defined but never used.", "'b' is defined but never used.", "'c' is defined but never used."]
 
     },
     {
       code: '<template><div v-for="(a, b, c) in foo">{{a}}</div></template>',
-      errors: ["'b' is defined but never used.", "'c' is defined but never used."],
-      output: '<template><div v-for="(a, _b, _c) in foo">{{a}}</div></template>'
+      errors: ["'b' is defined but never used.", "'c' is defined but never used."]
     },
     {
       code: '<template><div v-for="(a, b, c) in foo">{{b}}</div></template>',
-      errors: ["'c' is defined but never used."],
-      output: '<template><div v-for="(a, b, _c) in foo">{{b}}</div></template>'
+      errors: ["'c' is defined but never used."]
     },
     {
       code: '<template><div v-for="(item, key) in items" :key="item.id">{{item.name}}</div></template>',
-      errors: ["'key' is defined but never used."],
-      output: '<template><div v-for="(item, _key) in items" :key="item.id">{{item.name}}</div></template>'
+      errors: ["'key' is defined but never used."]
     },
     {
       code: '<template><div v-for="x in items">{{value | x}}</div></template>',
-      errors: ["'x' is defined but never used."],
-      output: '<template><div v-for="_x in items">{{value | x}}</div></template>'
-
+      errors: ["'x' is defined but never used."]
+    },
+    {
+      code: '<template><div v-for="x in items">{{value}}</div></template>',
+      options: [{ varIgnorePattern: 'ignore$' }],
+      errors: ["'x' is defined but never used."]
+    },
+    {
+      code: '<template><span slot-scope="props"></span></template>',
+      errors: ["'props' is defined but never used."],
+      options: [{ varIgnorePattern: '^ignore' }]
+    },
+    {
+      code: '<template><span><template scope="props"></template></span></template>',
+      errors: ["'props' is defined but never used."],
+      options: [{ varIgnorePattern: '^ignore' }]
     }
   ]
 })

From 6b94208e78c2dc9b83043859900d5ee598cc2c05 Mon Sep 17 00:00:00 2001
From: IWANABETHATGUY <974153916@qq.com>
Date: Mon, 9 Mar 2020 15:46:07 +0800
Subject: [PATCH 3/4] feat: change varIgnorepattern to ignorePattern, add test,
 update readme

---
 docs/rules/no-unused-vars.md      | 12 ++++++++++--
 lib/rules/no-unused-vars.js       | 22 ++++++++++++----------
 tests/lib/rules/no-unused-vars.js | 29 ++++++++++++++++++-----------
 3 files changed, 40 insertions(+), 23 deletions(-)

diff --git a/docs/rules/no-unused-vars.md b/docs/rules/no-unused-vars.md
index a6f9205f8..9b9fdf891 100644
--- a/docs/rules/no-unused-vars.md
+++ b/docs/rules/no-unused-vars.md
@@ -34,8 +34,16 @@ This rule report variable definitions of v-for directives or scope attributes if
 
 ## :wrench: Options
 
-Nothing.
-
+```js
+{
+    "vue/no-unsed-vars": [{
+        "ignorePattern": '^_',
+    }]
+}
+```
+- `ignorePattern` ... disables reporting when your definitions of v-for directives or scope attributes match your ignorePattern Regular expression. default `null`, will ignore nothing
+## :rocket: Suggestion
+- When your ignorePattern set to `^_`, we could provide a suggestion which add a prefix`_` to your variable and no more eslint error
 ## :mag: Implementation
 
 - [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-unused-vars.js)
diff --git a/lib/rules/no-unused-vars.js b/lib/rules/no-unused-vars.js
index aa31a6b90..f9b2caf2b 100644
--- a/lib/rules/no-unused-vars.js
+++ b/lib/rules/no-unused-vars.js
@@ -23,7 +23,7 @@ module.exports = {
       {
         'type': 'object',
         'properties': {
-          'varIgnorePattern': {
+          'ignorePattern': {
             'type': 'string'
           }
         },
@@ -33,18 +33,20 @@ module.exports = {
   },
 
   create (context) {
-    const option = context.options[0] || { varIgnorePattern: '^_' }
-    const pattern = option['varIgnorePattern'] || '^_'
-    // only use for construct a regularExpression
-    // eslint-disable-next-line no-eval
-    const regExp = eval(`/${pattern}/`)
+    const option = context.options[0] || { }
+    const pattern = option['ignorePattern']
+    let regExp = null
+    if (pattern) {
+      regExp = new RegExp(pattern, 'u')
+    }
     return utils.defineTemplateBodyVisitor(context, {
       VElement (node) {
         const variables = node.variables
 
         for (
           let i = variables.length - 1;
-          i >= 0 && !regExp.test(variables[i].id.name) && !variables[i].references.length;
+          // eslint-disable-next-line no-unmodified-loop-condition
+          i >= 0 && !variables[i].references.length && (regExp === null || !regExp.test(variables[i].id.name));
           i--
         ) {
           const variable = variables[i]
@@ -53,14 +55,14 @@ module.exports = {
             loc: variable.id.loc,
             message: `'{{name}}' is defined but never used.`,
             data: variable.id,
-            suggest: [
+            suggest: pattern === '^_' ? [
               {
-                desc: 'Replace the unused-var with default ignore pattern',
+                desc: `Replace the ${variable.id.name} with _${variable.id.name}`,
                 fix: function (fixer) {
                   return fixer.replaceText(variable.id, `_${variable.id.name}`)
                 }
               }
-            ]
+            ] : []
           })
         }
       }
diff --git a/tests/lib/rules/no-unused-vars.js b/tests/lib/rules/no-unused-vars.js
index 3038c2797..cd2eb645d 100644
--- a/tests/lib/rules/no-unused-vars.js
+++ b/tests/lib/rules/no-unused-vars.js
@@ -55,19 +55,15 @@ tester.run('no-unused-vars', rule, {
     },
     {
       code: '<template><div v-for="_ in foo" ></div></template>',
-      options: [{ varIgnorePattern: '^_' }]
-
-    },
-    {
-      code: '<template><div v-for="_i in foo" ></div></template>'
+      options: [{ ignorePattern: '^_' }]
     },
     {
       code: '<template><div v-for="ignorei in foo" ></div></template>',
-      options: [{ varIgnorePattern: '^ignore' }]
+      options: [{ ignorePattern: '^ignore' }]
     },
     {
       code: '<template><div v-for="thisisignore in foo" ></div></template>',
-      options: [{ varIgnorePattern: 'ignore$' }]
+      options: [{ ignorePattern: 'ignore$' }]
     }
   ],
   invalid: [
@@ -114,22 +110,33 @@ tester.run('no-unused-vars', rule, {
     },
     {
       code: '<template><div v-for="x in items">{{value | x}}</div></template>',
-      errors: ["'x' is defined but never used."]
+      errors: [{
+        message: "'x' is defined but never used.",
+        suggestions: [{
+          desc: 'Replace the x with _x',
+          output: '<template><div v-for="_x in items">{{value | x}}</div></template>'
+        }]
+      }],
+      options: [{ ignorePattern: '^_' }]
     },
     {
       code: '<template><div v-for="x in items">{{value}}</div></template>',
-      options: [{ varIgnorePattern: 'ignore$' }],
+      options: [{ ignorePattern: 'ignore$' }],
       errors: ["'x' is defined but never used."]
     },
     {
       code: '<template><span slot-scope="props"></span></template>',
       errors: ["'props' is defined but never used."],
-      options: [{ varIgnorePattern: '^ignore' }]
+      options: [{ ignorePattern: '^ignore' }]
     },
     {
       code: '<template><span><template scope="props"></template></span></template>',
       errors: ["'props' is defined but never used."],
-      options: [{ varIgnorePattern: '^ignore' }]
+      options: [{ ignorePattern: '^ignore' }]
+    },
+    {
+      code: '<template><div v-for="_i in foo" ></div></template>',
+      errors: ["'_i' is defined but never used."]
     }
   ]
 })

From 9951e7bb0eb706188280b48e92d77c6c88b5b44b Mon Sep 17 00:00:00 2001
From: IWANABETHATGUY <974153916@qq.com>
Date: Mon, 9 Mar 2020 16:02:27 +0800
Subject: [PATCH 4/4] docs: update doc

---
 docs/rules/README.md         | 2 +-
 docs/rules/no-unused-vars.md | 3 +--
 lib/rules/no-unused-vars.js  | 2 +-
 3 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 308a10de0..ab1f5b220 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -48,7 +48,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/no-template-key](./no-template-key.md) | disallow `key` attribute on `<template>` |  |
 | [vue/no-textarea-mustache](./no-textarea-mustache.md) | disallow mustaches in `<textarea>` |  |
 | [vue/no-unused-components](./no-unused-components.md) | disallow registering components that are not used inside templates |  |
-| [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes | :wrench: |
+| [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |  |
 | [vue/no-use-v-if-with-v-for](./no-use-v-if-with-v-for.md) | disallow use v-if on the same element as v-for |  |
 | [vue/require-component-is](./require-component-is.md) | require `v-bind:is` of `<component>` elements |  |
 | [vue/require-prop-type-constructor](./require-prop-type-constructor.md) | require prop type to be a constructor | :wrench: |
diff --git a/docs/rules/no-unused-vars.md b/docs/rules/no-unused-vars.md
index 9b9fdf891..3ce57fa94 100644
--- a/docs/rules/no-unused-vars.md
+++ b/docs/rules/no-unused-vars.md
@@ -8,13 +8,12 @@ description: disallow unused variable definitions of v-for directives or scope a
 > disallow unused variable definitions of v-for directives or scope attributes
 
 - :gear: This rule is included in all of `"plugin:vue/essential"`, `"plugin:vue/strongly-recommended"` and `"plugin:vue/recommended"`.
-- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
 
 ## :book: Rule Details
 
 This rule report variable definitions of v-for directives or scope attributes if those are not used.
 
-<eslint-code-block fix :rules="{'vue/no-unused-vars': ['error']}">
+<eslint-code-block :rules="{'vue/no-unused-vars': ['error']}">
 
 ```vue
 <template>
diff --git a/lib/rules/no-unused-vars.js b/lib/rules/no-unused-vars.js
index f9b2caf2b..6e3e39e4c 100644
--- a/lib/rules/no-unused-vars.js
+++ b/lib/rules/no-unused-vars.js
@@ -18,7 +18,7 @@ module.exports = {
       category: 'essential',
       url: 'https://eslint.vuejs.org/rules/no-unused-vars.html'
     },
-    fixable: 'code',
+    fixable: null,
     schema: [
       {
         'type': 'object',