The community-owned codemod registry.
Discover the power of codemods for your development workflow. Our tools and resources allow you to easily manage dependencies, automate refactoring, and transform your codebase.
With support for code migration and evolution, you can modernize your code and keep it up-to-date with the latest best practices.
Read the docsPublish
Create, test and publish your own codemods for your users.
Up-skill
Up-skill your engineering team using our guides & resources.
Go fast
Use our helpers & testing utilities to make writing codemods a breeze.
Registry
Explore an extensive list of codemods contributed by the community.
Bring users with you.
Don't let APIs of the past hold you back. Give users the tools they need to upgrade across major versions by creating version-targeted codemods.
import Button from '@my-lib/button';
const App = () => (
<Button
appearance="bold"
handleClick=()
>
Submit
</Button>
);
-import Button from '@my-lib/button';
+import Button from '@foobar/button';
const App = () => (
<Button
appearance="bold"
- handleClick=()
+ onClick=()
>
Submit
</Button>
);
import Button from '@foobar/button';
const App = () => (
<Button
- appearance="bold"
+ appearance="primary"
onClick=()
>
Submit
</Button>
);
How it works.
1. Initialize your project
Instantly create a brand new Hypermod package that can be run from anywhere.
$ npx @hypermod/cli init foobar
2. Create a config
Label and organise your codemods.
- Transforms: codemods that modify package across multiple versions
- Presets: Utility codemods that support the use of a package
export.module = {
transforms: {
'12.0.0': require('./18.0.0/transform'),
'13.0.0': require('./19.0.0/transform'),
},
presets: {
'format-imports': require('./format-imports/transform')
}
};3. Write your codemod
Painlessly author your codemod using our delightful library of utilities and documentation.
import {
hasImportDeclaration,
renameImportDeclaration,
} from '@hypermod/utils';
function transformer(file, { jscodeshift: j }) {
const source = j(file.source);
const oldImport = 'bar';
const newImport = 'foobar';
if (!hasImportDeclaration(j, source, oldImport)) {
return file.source;
}
renameImportDeclaration(j, source, oldImport, newImport),
return source.toSource();
}
export default transformer;4. Publish
With a single command, share your codemods with the world. No need to create a bespoke CLI client.
$ npm publish
5. Run
Give your consumers a single API to keep their code up to date with the latest and greatest.
$ npx @hypermod/cli -p foobar@12.0.0 path/to/src
Help make the JS ecosystem a better place.
Hypermod exists to make dependency management feel less of a juggling act. But it's a team effort...