Skip to main content

The community-owned codemod registry.

Write, test, publish and consume codemods in a structured, standardized and familiar way.

Read the docs
🎁

Publish

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>
+);
v1.0.0
-import Button from '@my-lib/button';
+import Button from '@foobar/button';


const App = () => (
<Button
appearance="bold"
- handleClick=()
+ onClick=()
>
Submit
</Button>
);
v2.0.0
import Button from '@foobar/button';

const App = () => (
<Button
- appearance="bold"
+ appearance="primary"
onClick=()
>
Submit
</Button>
);
v3.0.0

How it works.

  1. 1. Initialize your project

    Instantly create a brand new codeshift package that can be run from anywhere.

    $ npx @codeshift/cli init --packageName foobar
  2. 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.resolve('./18.0.0/transform'),
    '13.0.0': require.resolve('./19.0.0/transform'),
    },
    presets: {
    'format-imports': require.resolve('./format-imports/transform')
    }
    };
  3. 3. Write your codemod

    Painlessly author your codemod using our delightful library of utilities and documentation.

    import {
    hasImportDeclaration,
    renameImportDeclaration,
    } from '@codeshift/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. 4. Publish

    With a single command, share your codemods with the world. No need to create a bespoke CLI client.

    $ npm publish
  5. 5. Run

    Give your consumers a single API to keep their code up to date with the latest and greatest.

    $ npx @codeshift/cli -p foobar@12.0.0 path/to/src

Help make the JS ecosystem a better place.

CodeshiftCommunity exists to make dependency management feel less of a juggling act. But it's a team effort...

CodeshiftCommunity logo