Vue 3 Typescript Class Component - Type 'typeof import(.../node_modules/vue/dist/vue")' is not a constructor function type

Question

Hi I'm using Vue 3 with Typescript and Class Components. I just copy-pasted the example from the docs but it looks like there is an issue with Typescript:

TS1238: Unable to resolve signature of class decorator when called as an expression.
  This expression is not callable.
    Type 'typeof import(".../node_modules/vue-class-component/dist/vue-class-component")' has no call signatures.

TS2507: Type 'typeof import(".../node_modules/vue/dist/vue")' is not a constructor function type.

The docs: https://class-component.vuejs.org/guide/class-component.html

Does anybody know what is missing? Thanks!

Solution

Based on this issue there's no need to that decorator and the imports are different for the version 3

<template>
  <div>{{ message }}</div>
 
</template>

<script lang="ts">

import { Vue } from 'vue-class-component'


export default class HelloWorld extends Vue {
  message="Hello World"
}
</script>

Comments

[Tom]

Thanks! As you pointed out Component will be renamed to Options. github.com/vuejs/vue-class-component/issues/406

[Eria]

I have the exact same problem. The solution resolves the first error, on the Component decorator. But the error on Vue is still here...

[Boussadjra Brahim]

can you please clarify more your second issue