vue-codemod
vue-codemod copied to clipboard
vuejs
Vue class based to vue2 with TS support
Nice! We've to migrate a bunch of components from class to composition functions on our project. I'll start from this, it helps a lot. Thanks ;)
@matrunchyk I've a bunch of TS errors when trying to build, like Property 'init' does not exist on type 'Identifier' any idea?
That's ast-types typings.
I tried with npm and yarn, and with node@12 also.
Since @types/jscodeshift is still 0.7.1 I don't get what's the issue.
I tried to upgrade @types/jscodeshift to 0.11.0, or to downgrade jscodeshift to 0.7.1 but it didn't help.
@rndmerle Yeah I will have to enhance typings by declaring appropriate types/interfaces. For now feel free to ignore issues by specifying : any or as any wherever needed.
It would be great if we can update this to use the new Vue 2.7 defineComponent instead. Which has much better type inference, however I don't think it supports mixins.
This is exactly what it does for TS components keeping all the typings.
Btw, I have another script which migrates Vue2 to Vue3 script setup (mixin are also supported). I'll publish/share a repo if someone will be interested.
@matrunchyk You are using the Vue.extend api. I am talking about defineComponent from Vue 2.7 (and 3) which has much better support for Typescript.
https://blog.vuejs.org/posts/vue-2-7-naruto.html
Ah you're right @NikhilVerma. I think the argument of Vue.extend and defineCompontent is compatible, so after using the script you could just Find-Replace all mentions of Vue.extend to defineComponent as-is. That's basically what I did in my projects.
But I agree, we can replace it directly in the migration script itself.
Hey @matrunchyk ,
Btw, I have another script which migrates Vue2 to Vue3 script setup (mixin are also supported). I'll publish/share a repo if someone will be interested.
I'd be interested in the Vue 3 script setup version even if only partially working since I have a few (read: hundreds) of components to convert, and any starting point is better than none. 😅 Would you mind sharing it with me?
Hi @matrunchyk Can you pls let me know how to use this to convert vue2 class based code with TS to vue3 options api
