# reactjs/react-codemod

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/reactjs-react-codemod).**

4,403 stars · 297 forks · JavaScript · MIT

## Links

- GitHub: https://github.com/reactjs/react-codemod
- awesome-repositories: https://awesome-repositories.com/repository/reactjs-react-codemod.md

## Description

This project is a suite of abstract syntax tree transformation tools designed to automate the migration of source code to newer versions of React. It provides a set of scripts that programmatically modify code structures to replace deprecated APIs and component patterns with modern equivalents.

The toolkit specializes in converting class components into functional components using arrow functions and prop destructuring. It also includes utilities for modernizing JSX syntax, updating deprecated lifecycle methods to stable versions, and migrating legacy string-based references to callback refs.

Additional capabilities cover the optimization of import patterns, the removal of redundant imports, and the updating of package references and module paths. The project uses rule-driven source migration and pattern-matching syntax analysis to ensure transformations are applied consistently across large codebases.

## Tags

### Development Tools & Productivity

- [API Version Migration Scripts](https://awesome-repositories.com/f/development-tools-productivity/api-version-migration-scripts.md) — Provides specialized scripts for automating the transition between different API versions of a framework.
- [AST Transformation Tools](https://awesome-repositories.com/f/development-tools-productivity/ast-transformation-tools.md) — Provides a suite of utilities for parsing, manipulating, and transforming source code via Abstract Syntax Trees to automate framework migrations.
- [AST-Based Source Transformations](https://awesome-repositories.com/f/development-tools-productivity/ast-transformation-tools/ast-to-source-conversion/ast-based-source-transformations.md) — Provides programmatic modification of source code by replacing matched abstract syntax tree nodes while preserving original formatting.
- [Automated Large-Scale Refactoring](https://awesome-repositories.com/f/development-tools-productivity/automated-large-scale-refactoring.md) — Executes synchronized structural changes across entire codebases to align with new import patterns and module structures.
- [Framework Version Migrators](https://awesome-repositories.com/f/development-tools-productivity/framework-version-migrators.md) — Automates the update of source code to newer React versions by replacing deprecated APIs and patterns.
- [Automated Migration Codemods](https://awesome-repositories.com/f/development-tools-productivity/project-scaffolding-config-code-generation/migration-tools/automated-migration-codemods.md) — Ships automated migration codemods to transform deprecated function calls and component patterns into modern equivalents. ([source](https://github.com/reactjs/react-codemod#readme))

### Programming Languages & Runtimes

- [Source Code Transformation Engines](https://awesome-repositories.com/f/programming-languages-runtimes/source-code-compilers/source-code-templates/source-code-transformation-engines.md) — Implements a transformation engine that replaces or removes specific code segments to resolve compatibility issues. ([source](https://github.com/reactjs/react-codemod/blob/master/package.json))
- [JavaScript Source Transformers](https://awesome-repositories.com/f/programming-languages-runtimes/source-code-compilers/source-code-templates/source-code-transformation-engines/javascript-source-parsers/javascript-source-transformers.md) — Provides tools for programmatically transforming JavaScript source code through AST manipulation pipelines.
- [Modernizers](https://awesome-repositories.com/f/programming-languages-runtimes/language-features-paradigms/language-features/language-extensions/jsx-syntax/modernizers.md) — Converts legacy element creation calls and deprecated provider syntax into standard JSX elements. ([source](https://github.com/reactjs/react-codemod#readme))
- [Import Optimizations](https://awesome-repositories.com/f/programming-languages-runtimes/module-importing/import-optimizations.md) — Removes redundant imports and converts namespace imports to named imports to optimize module structures. ([source](https://github.com/reactjs/react-codemod/blob/master/README.md))

### Software Engineering & Architecture

- [AST-Based Refactorers](https://awesome-repositories.com/f/software-engineering-architecture/abstract-syntax-tree-tools/internal-tree-representations/ast-based-refactorers.md) — Implements automated refactoring by modifying internal syntax trees and rendering them back to source code.
- [Declarative Pattern Matching](https://awesome-repositories.com/f/software-engineering-architecture/syntax-tree-analysis/declarative-pattern-matching.md) — Uses declarative pattern matching to identify deprecated API calls and component patterns within the abstract syntax tree.
- [Deprecated Method Renaming](https://awesome-repositories.com/f/software-engineering-architecture/deprecated-api-detectors/deprecated-method-renaming.md) — Automatically updates deprecated or experimental lifecycle method names to their stable or unsafe versions. ([source](https://github.com/reactjs/react-codemod/blob/master/README.md))
- [Transformation Idempotency](https://awesome-repositories.com/f/software-engineering-architecture/idempotency-mechanisms/operation-idempotency/formatting-idempotency/transformation-idempotency.md) — Ensures that running migration scripts multiple times does not corrupt the source code.
- [Package Import Mappers](https://awesome-repositories.com/f/software-engineering-architecture/package-based-code-organization/directory-to-package-mappings/external-reference-mappings/package-import-mappers.md) — Swaps outdated module references and import paths between split packages or externalized dependencies. ([source](https://github.com/reactjs/react-codemod#readme))

### User Interface & Experience

- [Class to Functional Component Converters](https://awesome-repositories.com/f/user-interface-experience/component-utilities/ui-frameworks/rendering-models/composition-rendering-patterns/component-patterns/class-components/class-to-functional-component-converters.md) — Transforms ES6 class components into functional components using arrow functions and prop destructuring. ([source](https://github.com/reactjs/react-codemod#readme))
- [Class to Functional Component Converters](https://awesome-repositories.com/f/user-interface-experience/functional-components/class-to-functional-component-converters.md) — Transforms legacy React class components into modern functional components using hooks and arrow functions.
- [Functional Component Converters](https://awesome-repositories.com/f/user-interface-experience/functional-components/functional-component-converters.md) — Transforms ES6 class components into functional components with arrow functions and prop destructuring.
- [Ref Migration Tools](https://awesome-repositories.com/f/user-interface-experience/component-architectures/component-communication-patterns/component-data-passing/ref-forwarding/ref-migration-tools.md) — Replaces deprecated string-based references with callback refs to ensure stable element referencing. ([source](https://github.com/reactjs/react-codemod#readme))
- [Refactoring Utilities](https://awesome-repositories.com/f/user-interface-experience/component-utilities/ui-frameworks/rendering-models/jsx-syntax-extensions/jsx-syntax-support/refactoring-utilities.md) — Provides utilities to convert legacy element creation and outdated provider syntax into standard JSX elements.

### Testing & Quality Assurance

- [AST Traversal Utilities](https://awesome-repositories.com/f/testing-quality-assurance/static-code-analysis/structural-static-analysis/ast-traversal-utilities.md) — Walks through the program structure to find and update specific naming conventions and import declarations.

### Web Development

- [Lifecycle Method Modernizers](https://awesome-repositories.com/f/web-development/react-development/performance-optimizers/lifecycle-optimization/lifecycle-method-modernizers.md) — Updates deprecated or experimental lifecycle methods to their stable equivalents to ensure framework compatibility.