Repository: vuejs/composition-api (ts)

Issue:
Typescript error with functional component
Hi,

I have an error by defining a functional component in Typescript with the composition api:

```javascript
import { defineComponent } from '@vue/composition-api';

export default defineComponent({
  functional: true,
});
```

```
Error:(14, 3) TS2769: No overload matches this call.
  Overload 1 of 3, '(options: ComponentOptionsWithoutProps<unknown, unknown, Data, {}, {}>): VueProxy<unknown, unknown, Data, {}, {}>', gave the following error.
    Argument of type '{ functional: boolean; }' is not assignable to parameter of type 'ComponentOptionsWithoutProps<unknown, unknown, Data, {}, {}>'.
      Object literal may only specify known properties, and 'functional' does not exist in type 'ComponentOptionsWithoutProps<unknown, unknown, Data, {}, {}>'.
  Overload 2 of 3, '(options: ComponentOptionsWithArrayProps<string, Data, Data, {}, {}, Readonly<{ [x: string]: any; }>>): VueProxy<Readonly<{ [x: string]: any; }>, Data, Data, {}, {}>', gave the following error.
    Argument of type '{ functional: boolean; }' is not assignable to parameter of type 'ComponentOptionsWithArrayProps<string, Data, Data, {}, {}, Readonly<{ [x: string]: any; }>>'.
      Object literal may only specify known properties, and 'functional' does not exist in type 'ComponentOptionsWithArrayProps<string, Data, Data, {}, {}, Readonly<{ [x: string]: any; }>>'.
  Overload 3 of 3, '(options: ComponentOptionsWithProps<ComponentPropsOptions<Data>, Data, Data, {}, {}, ({ [x: number]: string; } & { toString?: string; toLocaleString?: string; concat?: string[]; indexOf?: (searchElement: string, fromIndex?: number) => number; ... 25 more ...; values?: IterableIterator<...>; }) | ({} & { ...; })>): VueProxy<...>', gave the following error.
    Argument of type '{ functional: boolean; }' is not assignable to parameter of type 'ComponentOptionsWithProps<ComponentPropsOptions<Data>, Data, Data, {}, {}, ({ [x: number]: string; } & { toString?: string; toLocaleString?: string; concat?: string[]; indexOf?: (searchElement: string, fromIndex?: number) => number; ... 25 more ...; values?: IterableIterator<...>; }) | ({} & { ...; })>'.
      Object literal may only specify known properties, and 'functional' does not exist in type 'ComponentOptionsWithProps<ComponentPropsOptions<Data>, Data, Data, {}, {}, ({ [x: number]: string; } & { toString?: string; toLocaleString?: string; concat?: string[]; indexOf?: (searchElement: string, fromIndex?: number) => number; ... 25 more ...; values?: IterableIterator<...>; }) | ({} & { ...; })>'.
```


The same code works on Vue 3.

Pull request:
fix(types): allow any custom options for defineComponent, fix #579

Patch:
diff --git a/src/component/componentOptions.ts b/src/component/componentOptions.ts
index d31b615..5f0f150 100644
--- a/src/component/componentOptions.ts
+++ b/src/component/componentOptions.ts
@@ -45,6 +45,10 @@ interface ComponentOptionsBase<
     Vue2ComponentOptions<Vue, D, M, C, Props>,
     'data' | 'computed' | 'method' | 'setup' | 'props'
   > {
+  // allow any custom options
+  [key: string]: any
+
+  // rewrite options api types
   data?: (this: Props & Vue, vm: Props) => D
   computed?: C
   methods?: M


Test patch:
diff --git a/test/types/defineComponent.spec.ts b/test/types/defineComponent.spec.ts
index 709fda7..b08ef9b 100644
--- a/test/types/defineComponent.spec.ts
+++ b/test/types/defineComponent.spec.ts
@@ -1,10 +1,4 @@
-import {
-  defineComponent,
-  h,
-  ref,
-  SetupContext,
-  PropType,
-} from '../../src'
+import { defineComponent, h, ref, SetupContext, PropType } from '../../src'
 import Router from 'vue-router'
 
 const Vue = require('vue/dist/vue.common.js')
@@ -167,6 +161,14 @@ describe('defineComponent', () => {
     expect.assertions(2)
   })
 
+  it('should any custom options', () => {
+    const App = defineComponent({
+      foo: 'foo',
+      bar: 'bar',
+    })
+    new Vue(App)
+  })
+
   it('infer the required prop', () => {
     const App = defineComponent({
       props: {