feat: Add allowVariableNamePattern to valid-define-options

Author: 2586740555

docs/rules/valid-define-options.md

@@ -108,7 +108,18 @@ defineOptions({ props: { msg: String } })
 
 ## :wrench: Options
 
-Nothing.
+```json
+{
+  "vue/valid-define-options": [
+    "error",
+    {
+      "allowVariableNamePattern": "^[A-Z_]+$"
+    }
+  ]
+}
+```
+
+- `allowVariableNamePattern` Allow reference to declared variables if variable name matches patterns, default `null`.
 
 ## :couple: Related Rules
 

lib/rules/valid-define-options.js

@@ -16,7 +16,17 @@ module.exports = {
       url: 'https://eslint.vuejs.org/rules/valid-define-options.html'
     },
     fixable: null,
-    schema: [],
+    schema: [
+      {
+        type: 'object',
+        properties: {
+          allowVariableNamePattern: {
+            type: 'string'
+          }
+        },
+        additionalProperties: false
+      }
+    ],
     messages: {
       referencingLocally:
         '`defineOptions` is referencing locally declared variables.',
@@ -29,6 +39,13 @@ module.exports = {
   },
   /** @param {RuleContext} context */
   create(context) {
+    const option = context.options[0] || {}
+    const allowVariableNamePattern = option.allowVariableNamePattern
+    /** @type {RegExp | null} */
+    let allowVariableNamePatternRegEx = null
+    if (allowVariableNamePattern) {
+      allowVariableNamePatternRegEx = new RegExp(allowVariableNamePattern, 'u')
+    }
     const scriptSetup = utils.getScriptSetupElement(context)
     if (!scriptSetup) {
       return {}
@@ -93,7 +110,9 @@ module.exports = {
                   (def) =>
                     def.type !== 'ImportBinding' &&
                     utils.inRange(scriptSetup.range, def.name) &&
-                    !utils.inRange(defineOptions.range, def.name)
+                    !utils.inRange(defineOptions.range, def.name) &&
+                    (allowVariableNamePatternRegEx === null ||
+                      !allowVariableNamePatternRegEx.test(variable.name))
                 )
               ) {
                 if (utils.withinTypeNode(node)) {

tests/lib/rules/valid-define-options.js

@@ -74,6 +74,15 @@ tester.run('valid-define-options', rule, {
 
       defineOptions(def);
       </script>`
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+        const COMPONENT_NAME = 'TestComponent'
+        defineOptions({ name: COMPONENT_NAME })
+      </script>`,
+      options: [{ allowVariableNamePattern: '^[A-Z_]+$' }]
     }
   ],
   invalid: [
@@ -205,6 +214,21 @@ tester.run('valid-define-options', rule, {
           line: 3
         }
       ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+        const componentName = "TestComponent"
+        defineOptions({ name: componentName });
+      </script>`,
+      options: [{ allowVariableNamePattern: '^[A-Z_]+$' }],
+      errors: [
+        {
+          message: '`defineOptions` is referencing locally declared variables.',
+          line: 4
+        }
+      ]
     }
   ]
 })