This repository was archived by the owner on Sep 21, 2019. It is now read-only.
This repository was archived by the owner on Sep 21, 2019. It is now read-only.
arrayOf and shape #15
Closed
Description
First of, thanks for creating this!
Trying to convert a JS file with some advanced propTypes, I don't get the result I expected.
type RouterProps = {
routes: string;
};
Looking at your conversion code, I see that it's using some regular expressions. To make the converter a lot more stable and extendable, I'd recommend using a proper parser instead. For example, using the acorn-jsx parser we get very nice results:
var acorn = require('acorn-jsx');
var code = "import React from \'react\';\nimport PropTypes from \'prop-types\';\nimport { connect } from \'react-redux\';\nimport { match } from \'.\/match\';\n\nclass Router extends React.Component {\n constructor() {\n super();\n this.state = {\n component: null,\n params: {},\n };\n this.getNewComponent = this.getNewComponent.bind(this);\n }\n\n componentWillMount() {\n const { routes, router } = this.props;\n this.getNewComponent(routes, router.pathname);\n }\n\n componentWillReceiveProps(nextProps) {\n const { routes, router } = nextProps;\n this.getNewComponent(routes, router.pathname);\n }\n\n getNewComponent(routes, pathname) {\n const { route, params } = match(routes, pathname);\n if (route) {\n route.load().then((component) => {\n this.setState({ params, component });\n });\n }\n }\n\n render() {\n const { component: Component, params } = this.state;\n const { queries, hash } = this.props.router;\n return Component ? <Component params={params} queries={queries} hash={hash} \/> : null;\n }\n}\n\nRouter.propTypes = {\n routes: PropTypes.arrayOf(PropTypes.shape({\n path: PropTypes.string.isRequired,\n load: PropTypes.func.isRequired,\n children: PropTypes.array,\n })).isRequired,\n router: PropTypes.shape({\n pathname: PropTypes.string.isRequired,\n search: PropTypes.string.isRequired,\n queries: PropTypes.object.isRequired,\n hash: PropTypes.string.isRequired,\n }),\n};\n\nconst RouterContainer = connect(({ router }) => ({ router }))(Router);\n\nexport { Router, RouterContainer };\n"
var ast = acorn.parse(code, {
sourceType: "module",
plugins: {
jsx: { allowNamespaces: false }
}
});
console.log(ast.body[5])
To try it out paste the code into runkit.
Metadata
Metadata
Assignees
Labels
No labels