A codemod helps you make sweeping changes to your code in a really straightforward way. React and Ember both use codemods a ton to help make the upgrade path easy.
It’s kinda like changing your code using a regular expression, except way better. Instead of manipulating strings, it’s based on manipulating the Abstract Syntax Tree. To see what an Abstract Syntax Tree (ast) is like, try putting some code into ASTExplorer and see what it spits out!
Some technologies involved:
codemod- language-agnostic tool to help run ast manipulations on a codebase / files
recast- a library that helps read/write AST (using
To write a codemod I use
jscodeshift directly, and it incorporates the rest. I’ve had to read documentation from them all, but I don’t have to import anything specifically from the others.
I made my first codemod this week! It helps ember users migrate away from importing
faker that’s bundled in
ember-cli-mirage to instead import it from
faker directly. I’m so glad we don’t have to edit these 200 files manually. This also helps out the whole Ember community, for when
ember-cli-mirage eventually moves away from having it bundled at all.
Here are some helpful references & resources I used to learn how codemods work, and create the one I did.
- Intro Articles
- Development Tips
- More Resources