Extend Vue Components in TypeScript
Share this video with your friends
This lesson shows how you can extend and reuse logic in Vue components using TypeScript inheritance. It will take you through extending a component, its properties and methods, and how hooks are triggered along the inheritance tree.
I'm getting these issues with the boilerplate
error TS2304: Cannot find name 'Vue'.
error TS2428: All declarations of 'ComponentOptions' must have identical type parameters.
error TS2714: The expression of an export assignment must be an identifier or qualified name in an ambient context.Also, after Vue 2.5 with added typescript support- is this tutorial still the best approach?
Hi Tobias, I've just cloned and run the repo and it seems to work correctly, could you open an issue in the repo with detailed steps to reproduce?
Vue 2.5 added excellent support for using TypeScript in the traditional-style Vue components. Writing class-based components is a valid option and it allows to write Vue components logic in a more standard way.
there are some warning in Parent.ts when i coding by use vscode.
(alias) Component<Vue>(options: ComponentOptions<Vue, object | ((this: Vue) => object), {
[key: string]: (this: Vue, ...args: any[]) =>Argument of type 'typeof Parent' is not assignable to parameter of type 'VueClass<Vue>'.
Type 'typeof Parent' is not assignable to type 'new (...args: any[]) => Vue'.
Type 'Parent' is not assignable to type 'Vue'.
Property '$el' is missing in type 'Parent'.import Vue[ts] Base constructor return type 'CombinedVueInstance<Vue, Data, Methods, Computed, Record<PropNames, any>>' is not a class or interface type.a duplicate comment, sorry.
a duplicate comment, sorry.
a duplicate comment, sorry.