feat(no-deprecated-slot-attribute): regex ignore patterns

.changeset/tangy-eagles-start.md

@@ -0,0 +1,5 @@
+---
+'eslint-plugin-vue': patch
+---
+
+[vue/no-deprecated-slot-attribute](https://eslint.vuejs.org/rules/no-deprecated-slot-attribute.html) `ignore` option now supports regex patterns.

docs/rules/no-deprecated-slot-attribute.md

@@ -48,7 +48,7 @@ This rule reports deprecated `slot` attribute in Vue.js v2.6.0+.
 }
 ```
 
-- `"ignore"` (`string[]`) An array of tags that ignore this rules. This option will check both kebab-case and PascalCase versions of the given tag names. Default is empty.
+- `"ignore"` (`string[]`) An array of tags or regular expression patterns (e.g. `/^custom-/`) that ignore this rules. This option will check both kebab-case and PascalCase versions of the given tag names. Default is empty.
 
 ### `"ignore": ["my-component"]`
 

lib/rules/syntaxes/slot-attribute.js

@@ -5,16 +5,29 @@
 'use strict'
 
 const canConvertToVSlot = require('./utils/can-convert-to-v-slot')
+const regexp = require('../../utils/regexp')
 const casing = require('../../utils/casing')
 
 module.exports = {
   deprecated: '2.6.0',
   supported: '<3.0.0',
   /** @param {RuleContext} context @returns {TemplateListener} */
   createTemplateBodyVisitor(context) {
+    /** @type {{ ignore: string[]}} */
     const options = context.options[0] || {}
+    const { ignore = [] } = options
     /** @type {Set<string>} */
-    const ignore = new Set(options.ignore)
+    const ignoreStrings = new Set()
+    /** @type {RegExp[]} */
+    const ignorePatterns = []
+
+    for (const str of ignore) {
+      if (regexp.isRegExp(str)) {
+        ignorePatterns.push(regexp.toRegExp(str))
+      } else {
+        ignoreStrings.add(str)
+      }
+    }
 
     const sourceCode = context.getSourceCode()
     const tokenStore =
@@ -123,12 +136,15 @@ module.exports = {
     function reportSlot(slotAttr) {
       const componentName = slotAttr.parent.parent.rawName
       if (
-        ignore.has(componentName) ||
-        ignore.has(casing.pascalCase(componentName)) ||
-        ignore.has(casing.kebabCase(componentName))
+        ignoreStrings.has(componentName) ||
+        ignoreStrings.has(casing.pascalCase(componentName)) ||
+        ignoreStrings.has(casing.kebabCase(componentName))
       ) {
         return
       }
+      if (ignorePatterns.some((pattern) => pattern.test(componentName))) {
+        return
+      }
 
       context.report({
         node: slotAttr.key,

tests/lib/rules/no-deprecated-slot-attribute.js

@@ -55,6 +55,18 @@ tester.run('no-deprecated-slot-attribute', rule, {
       </LinkList>
     </template>`,
       options: [{ ignore: ['one', 'two', 'my-component'] }]
+    },
+    {
+      code: `<template>
+      <LinkList>
+        <one slot="one" />
+        <two slot="two" />
+        <my-component slot="my-component-slot" />
+        <myComponent slot="myComponent-slot" />
+        <MyComponent slot="MyComponent-slot" />
+      </LinkList>
+    </template>`,
+      options: [{ ignore: ['/one/', '/^Two$/i', '/^my-.*/i'] }]
     }
   ],
   invalid: [
@@ -644,6 +656,82 @@ tester.run('no-deprecated-slot-attribute', rule, {
       ],
       errors: ['`slot` attributes are deprecated.']
     },
+    {
+      code: `
+      <template>
+        <my-component>
+          <one slot="one">
+            A
+          </one>
+          <two slot="two">
+            B
+          </two>
+        </my-component>
+      </template>`,
+      output: `
+      <template>
+        <my-component>
+          <one slot="one">
+            A
+          </one>
+          <template v-slot:two>\n<two >
+            B
+          </two>\n</template>
+        </my-component>
+      </template>`,
+      options: [
+        {
+          ignore: ['/one/']
+        }
+      ],
+      errors: [
+        {
+          message: '`slot` attributes are deprecated.',
+          line: 7,
+          endLine: 7,
+          column: 16,
+          endColumn: 20
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <my-component>
+          <one slot="one">
+            A
+          </one>
+          <two slot="two">
+            B
+          </two>
+        </my-component>
+      </template>`,
+      output: `
+      <template>
+        <my-component>
+          <one slot="one">
+            A
+          </one>
+          <template v-slot:two>\n<two >
+            B
+          </two>\n</template>
+        </my-component>
+      </template>`,
+      options: [
+        {
+          ignore: ['/^one$/']
+        }
+      ],
+      errors: [
+        {
+          message: '`slot` attributes are deprecated.',
+          line: 7,
+          endLine: 7,
+          column: 16,
+          endColumn: 20
+        }
+      ]
+    },
     {
       code: `
       <template>