typescript - 来自使用 vue-cli 创建的新 Vue.js 2 项目的打字稿错误

Question

我使用 vue-cli 4.5.13 创建了一个新的 Vue.js 2 应用程序。我选择的唯一功能是 Typescript。

当我打开VS Code 时main.ts，App.vue我从 Typescript 得到红色波浪线。

main.ts

// main.ts

import App from './App.vue'

Vue.config.productionTip = false

new Vue({  
  // App is marked as an error by Typescript
  render: h => h(App)
}).$mount('#app')

main.ts 中的错误

No overload matches this call.
  Overload 1 of 2, '(tag?: string | Component<any, any, any, any> | AsyncComponent<any, any, any, any> | (() => Component<DefaultData<never>, DefaultMethods<never>, DefaultComputed, DefaultProps>) | undefined, children?: VNodeChildren): VNode', gave the following error.
    Argument of type 'DefineComponent<unknown, object, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ... 4 more ..., {}>' is not assignable to parameter of type 'string | Component<any, any, any, any> | AsyncComponent<any, any, any, any> | (() => Component<DefaultData<never>, DefaultMethods<never>, DefaultComputed, DefaultProps>) | undefined'.
      Type 'ComponentPublicInstanceConstructor<{ $: ComponentInternalInstance; $data: {}; $props: Partial<{}> & Omit<Readonly<{ [x: string]: any; }> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): Watc...' is missing the following properties from type 'VueConstructor<Vue>': extend, nextTick, set, delete, and 9 more.
  Overload 2 of 2, '(tag?: string | Component<any, any, any, any> | AsyncComponent<any, any, any, any> | (() => Component<DefaultData<never>, DefaultMethods<never>, DefaultComputed, DefaultProps>) | undefined, data?: VNodeData | undefined, children?: VNodeChildren): VNode', gave the following error.
    Argument of type 'DefineComponent<unknown, object, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ... 4 more ..., {}>' is not assignable to parameter of type 'string | Component<any, any, any, any> | AsyncComponent<any, any, any, any> | (() => Component<DefaultData<never>, DefaultMethods<never>, DefaultComputed, DefaultProps>) | undefined'.
      Type 'DefineComponent<unknown, object, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ... 4 more ..., {}>' is not assignable to type 'VueConstructor<Vue>'.ts(2769)

应用程序.vue

export default Vue.extend({
  name: 'App',
  components: {
    // HelloWorld is marked as an error by Typescript
    HelloWorld
  }
});
</script>

App.Vue 中的错误

No overload matches this call.
  The last overload gave the following error.
    Type 'DefineComponent<unknown, object, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ... 4 more ..., {}>' is not assignable to type 'Component<any, any, any, any> | AsyncComponent<any, any, any, any>'.
      Type 'ComponentPublicInstanceConstructor<{ $: ComponentInternalInstance; $data: {}; $props: Partial<{}> & Omit<Readonly<{ [x: string]: any; }> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): Watc...' is missing the following properties from type 'VueConstructor<Vue>': extend, nextTick, set, delete, and 9 more.VueDX/TS(2769)

我的理解是我需要以某种方式明确声明正确的类型，但我该怎么做呢？还考虑到代码是由 vue-cli 生成的，是否可能是我的配置错误？

标签： typescriptvue.jsvisual-studio-codevuejs2