[codemod][new] vuejs - migration from 2 -> 3

codemod-com / codemod

The e2e platform for creating, sharing, and running codemods, built on top of your favorite codemod engine. Automate code migrations, cleanups, and refactors for yourself, colleagues, and the community.

https://codemod.com

Apache License 2.0

225 stars 10 forks source link

[codemod][new] vuejs - migration from 2 -> 3 #910

Open arshcodemod opened 2 weeks ago

arshcodemod commented 2 weeks ago

Migration details

[Link to upgrade guide]

[ ] codemod-appinitialization - [Codemod Studio Link]
[ ] codemod-globaltoinstanceAPIs - [Codemod Studio Link]
[ ] codemod-functionalcomponent - [Codemod Studio Link]
[ ] codemod-lifecyclehooks - [Codemod Studio Link]
[ ] codemod-customhooks - [Codemod Studio Link]
[ ] codemod-filters - [Codemod Studio Link]

To contributors working on this task:

[ ] Framework Expert: For each codemod use case in this migration, provide the Codemod Studio link (example) with detailed specifications. Include before/after pairs, transformation logic in comments, and edge cases. Even if the transformation is tricky, provide instructions on detecting the patterns. This helps estimate the effort needed and guides developers to the areas requiring manual changes.
[ ] Codemod Creator: Build and publish quality codemods that handle most edge cases. False negatives are acceptable, but there should be no false positives. Even if the transformation is tricky, build a codemod that can detect and add comments to guide developers to the areas needing manual changes.
Questions? -> Community

sadeghbarati commented 2 weeks ago

/cc @sxzz can you summon Vue 2 and 3 wizards here

More explanation about Codmod Studio from Alex:

use this link, containing the feature flag for our most advanced AI. use the "tour" button in the Studio to learn how the codemod studio works (and provide feedback if something is not clear) use this API doc for jscodeshift provide feedback if something is missing. keep in mind, that for a real life jscodeshift codemod, most of the code is about knowing the grammar of the parser....

Saeid-Za commented 2 weeks ago

Hello There! Thank you for starting this tracking issue. I believe there are some helpful tools that could serve as a reference.

vue-migration: A tool based on vue-codemod to migrate vue 2 to vue 3 (script setup)
vue-upgrade-tool - A codemod built on vue-metamorph to upgrade Vue 2 projects to Vue 3 (defineComponent or normal script style)

There are also other repositories, one that I used some years ago but couldn't find unfortunately.

I'd also suggest that setting the output target to script setup instead of normal script style.

One question that I have, is there a preference between jscodeshift and ts-moph as the engine? I've used ts-morph before, but have never worked with jscodeshift.