Support template literal component names in vue/no-undef-components (#1782)

* Move `isStringLiteral` function to utils

* Support template literal component names in `vue/no-undef-components`

Author: FloEdelmann

lib/rules/no-undef-components.js

@@ -202,9 +202,10 @@ module.exports = {
 
         const nameProperty = utils.findProperty(obj, 'name')
 
-        if (nameProperty) {
-          if (nameProperty.value.type === 'Literal') {
-            registeredComponentNames.push(`${nameProperty.value.value}`)
+        if (nameProperty && utils.isStringLiteral(nameProperty.value)) {
+          const name = utils.getStringLiteralValue(nameProperty.value)
+          if (name) {
+            registeredComponentNames.push(name)
           }
         }
 

lib/rules/prefer-separate-static-class.js

@@ -8,22 +8,11 @@
 // Requirements
 // ------------------------------------------------------------------------------
 
-const { defineTemplateBodyVisitor, getStringLiteralValue } = require('../utils')
-
-// ------------------------------------------------------------------------------
-// Helpers
-// ------------------------------------------------------------------------------
-
-/**
- * @param {ASTNode} node
- * @returns {node is Literal | TemplateLiteral}
- */
-function isStringLiteral(node) {
-  return (
-    (node.type === 'Literal' && typeof node.value === 'string') ||
-    (node.type === 'TemplateLiteral' && node.expressions.length === 0)
-  )
-}
+const {
+  defineTemplateBodyVisitor,
+  isStringLiteral,
+  getStringLiteralValue
+} = require('../utils')
 
 /**
  * @param {Expression | VForExpression | VOnExpression | VSlotScopeExpression | VFilterSequenceExpression} expressionNode

lib/utils/index.js

@@ -758,6 +758,17 @@ module.exports = {
     }
   },
 
+  /**
+   * @param {ASTNode} node
+   * @returns {node is Literal | TemplateLiteral}
+   */
+  isStringLiteral(node) {
+    return (
+      (node.type === 'Literal' && typeof node.value === 'string') ||
+      (node.type === 'TemplateLiteral' && node.expressions.length === 0)
+    )
+  },
+
   /**
    * Check whether the given node is a custom component or not.
    * @param {VElement} node The start tag node to check.

tests/lib/rules/no-undef-components.js

@@ -504,6 +504,19 @@ tester.run('no-undef-components', rule, {
         </script>
       `
     },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <custom-component />
+        </template>
+        <script>
+        export default {
+          name: \`CustomComponent\`
+        }
+        </script>
+      `
+    },
     {
       filename: 'test.vue',
       code: `