This is a JetBrains plug-in that automatically generates PropTypes code for React components, and only supports ES6 later at the moment. If you need to support ES5, please leave a message in issue.Compatible with: IntelliJ IDEA, PhpStorm, WebStorm, PyCharm, RubyMine, AppCode, CLion, Gogland, Rider.
If you are want use it by Visual Code or command line, I suggest you to use another plugin: react-proptypes-generate, now it is imperfect, welcome issue and PR.
- In plugin store search "ReactPropTypes" and install it , this is Store Link, Welcome comments.
- Click ReactPropTypes.jar(Recently, but may Unstable) to download and open Setting/Plugins/Install Plugin from disk to install.
How to use
- Select your Component's name
- Press command + N (Windows is alt + insert) show Generate Group and select PropTypesGenerate, or press shift + command + alt + P (Windows is shift + ctrl + alt + P) in the macOS
- Edit the PropTypes Table to modify default type
When you select
Shape as the PropType
How to Build and Development the project
- IntelliJ Platform Plugin SDK
- Download the latest IntelliJ IDEA Ultimate
- Clone and Open this project
- Delete default module and import plugin module by
- Config Project SDK named IntelliJ IDEA IU-182.** and Config language level 8
- Config plugin out dir and plugin launch Configurations
- Get a heightLight text as component's name if you are not select any text.
- In the Standard ES6 component, the plugin can distinguish props's reference and destructuring assignment with keyword "props" or "nextProps".
- In the Stateless component, only when your first param must be named "props" or a destructuring parameter the plugin can distinguished.
- If you select ES6 code style , the propTypes code will generate at the last line .Of cause, if you select ES7 code style, the propTypes code will generate at the component inside's first line.
- Double Click the row's name in the table, can modify distinguished name if not you expect, also support add a new row or delete what you not need.
- If your component has a default value for props, the plugin will fill the default type to the table.
- Support PropTypes.shape and handle defaultProps.
- You can custom your code generate's style.
- Supports automatic inference of functions and array types in code, and can be opened in the settings.
- Support full list of PropTypes
- Developing a similar plugin on the VS Code's platform
- Support Flow Or TypeScript's TypeChecker, and not use PropTypes