React JavaScript to TypeScript Transform
迁移 react + proptypes 代码至 react + typescript 的工具。
优先考虑转换后代码的兼容性,减少手动修正的代码量,以实现快速迁移。
栗子
input
class MyComponent extends React.Component {
static propTypes = {
alice: PropTypes.string.isRequired,
ate: PropTypes.number,
};
constructor(props) {
super(props);
this.ref = React.createRef();
this.state = { allen: '' };
}
onClick() {
this.setState({ drink: 3 });
}
render() {
const { cake } = this.props;
const { milk } = this.state;
return <div ref={this.ref}>HOME</div>;
}
}
output
interface IMyComponentProps extends React.HTMLAttributes<Element> {
alice: string;
ate?: number;
cake?: any;
}
type MyComponentState = {
allen?: string;
drink?: number;
milk?: any;
};
class MyComponent extends React.Component<IMyComponentProps, MyComponentState> {
ref: any;
constructor(props) {
super(props);
this.ref = React.createRef();
this.state = { allen: '' };
}
onClick() {
this.setState({ drink: 3 });
}
render() {
const { cake } = this.props;
const { milk } = this.state;
return <div ref={this.ref}>HOME</div>;
}
}
使用
安装
npm install -g react-proptypes-to-typescript
命令
react-proptypes-to-typescript "./src/**/*.js"
or
react-proptypes-to-typescript "./src/**/*.js" --remove-original-files