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!
Now, you should be able to get your Vue app up and running in TypeScript with features like defineComponent , data, props, computed properties, methods, and watchers. Vue 3.0 includes better support for TypeScript out of the box, and the entire Vue code was rewritten in TypeScript to improve maintainability.
One important feature of Vue is the ability to use components. Components are reusable Vue instances with custom HTML elements. Components can be reused as many times as you want or used in another component, making it a child component. Data, computed, watch, and methods can be used in a Vue component.
Vue 2 already has good support for TypeScript, and the recently published Vue 2.7 backported a lot of useful features from Vue 3, like composition API, <script setup> , and defineComponent , further improving the developer experience of TypeScript in Vue.
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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With