fix: handle function createApp and import from @vue/composition-api

Author: candy-Tong

lib/utils/index.js

@@ -2534,15 +2534,23 @@ function getVueComponentDefinitionType(context, node) {
         // only lint the createApp function that import from vue
         if (variable !== null && variable.defs.length === 1) {
           const def = variable.defs[0]
+
+          // ignore import {createApp} from 'other.js'
           if (
             def.type === 'ImportBinding' &&
             def.node.type === 'ImportSpecifier' &&
             def.node.imported.type === 'Identifier' &&
             def.node.parent.type === 'ImportDeclaration' &&
-            def.node.parent.source.value !== 'vue'
+            def.node.parent.source.value !== 'vue' &&
+            def.node.parent.source.value !== '@vue/composition-api'
           ) {
             return null
           }
+
+          // ignore function createApp(){}
+          if(def.type === 'FunctionName'){
+            return null
+          }
         }
 
         const isAppVueComponent = isObjectArgument(parent)

tests/lib/rules/one-component-per-file.js

@@ -69,6 +69,14 @@ ruleTester.run('one-component-per-file', rule, {
         createApp({})
         createApp({})
       `
+    },
+    {
+      filename: 'test.js',
+      code: `
+        function createApp(){}
+        createApp({})
+        createApp({})
+      `
     }
   ],
   invalid: [
@@ -122,6 +130,18 @@ ruleTester.run('one-component-per-file', rule, {
         'There is more than one component in this file.',
         'There is more than one component in this file.'
       ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        import { createApp } from '@vue/composition-api'
+        createApp({})
+        createApp({})
+      `,
+      errors: [
+        'There is more than one component in this file.',
+        'There is more than one component in this file.'
+      ]
     }
   ]
 })