React/Prop Types Typescript

1.0.5Last update Jul 24, 2024

@Codemod

Codemod verified

Official codemod published by a verified account. Learn more.

React

migration

Codemod to convert React PropTypes to TypeScript types.

Supports function and class components
Supports static propTypes declarations on class components
Supports forwardRefs
Supports files with multiple components
Copies JSDoc comments to the generated TypeScript types
Option to remove or preserve PropTypes after converting to TS

Before:

import PropTypes from 'prop-types';
import React from 'react';

export function MyComponent(props) {
	return <span />;
}

MyComponent.propTypes = {
	bar: PropTypes.string.isRequired,
	foo: PropTypes.number,
};

After:

import React from 'react';

interface MyComponentProps {
	bar: string;
	foo?: number;
}

export function MyComponent(props: MyComponentProps) {
	return <span />;
}

Codemod to convert React PropTypes to TypeScript types.

Supports function and class components
Supports static propTypes declarations on class components
Supports forwardRefs
Supports files with multiple components
Copies JSDoc comments to the generated TypeScript types
Option to remove or preserve PropTypes after converting to TS

Before:

import PropTypes from 'prop-types';
import React from 'react';

export function MyComponent(props) {
	return <span />;
}

MyComponent.propTypes = {
	bar: PropTypes.string.isRequired,
	foo: PropTypes.number,
};

After:

import React from 'react';

interface MyComponentProps {
	bar: string;
	foo?: number;
}

export function MyComponent(props: MyComponentProps) {
	return <span />;
}

Build custom codemods

Use AI-powered codemod studio and automate undifferentiated tasks for yourself, colleagues or the community

Get Started Now