prop-types-cleaner
Write simple prop-types cleaner by type, but write original prop-types without transforming.
Why prop-types-cleaner
When writing lots of prop-types with others, prop-types may become disordered like:
const propTypes = isOdps: PropTypesbool report: PropTypesxreportComponent selectedComponents: PropTypes isDragging: PropTypesbool updateReport: PropTypesfunc onResized: PropTypesfunc onStartResizing: PropTypesfunc toggleShortcutAttributePanel: PropTypesfunc shortcutAttributePanel: PropTypesbool updateUnmountComponents: PropTypesfunc domReportArea: PropTypesvalidateDOMElem toggleLinkModal: PropTypesfunc charts: PropTypesshape id: PropTypesstring content: PropTypesobject deleteChart: PropTypesfunc configureFilter: PropTypesfunc openSingleMode: PropTypesfunc closeSingleMode: PropTypesfunc isSingleMode: PropTypesbool
I think writing simple prop-types(e.g. number
, string
) by type and other prop-types(e.g. instanceOf
, shape
) by original writing will be more readable.
Installation
npm install --save prop-types-cleaner
Usage
; const propTypes = ;
It equals to:
const propTypes = // simple prop-types array_a: PropTypesarrayisRequired array_b: PropTypesarrayisRequired array_c: PropTypesarray array_d: PropTypesarray bool_a: PropTypesboolisRequired bool_b: PropTypesboolisRequired bool_c: PropTypesbool bool_d: PropTypesbool // original prop-types requiredObjectOf: PropTypesisRequired optionalObjectOf: PropTypes requiredObjectWithShape: PropTypesshape color: PropTypesstring fontSize: PropTypesnumber isRequired optionalObjectWithShape: PropTypesshape color: PropTypesstring fontSize: PropTypesnumber ;
Writing simple prop-types
array
, bool
, number
, object
, string
, symbol
, func
, node
, element
; const propTypes = ;
It equals to:
const propTypes = bool_a: PropTypesboolisRequired bool_b: PropTypesboolisRequired bool_c: PropTypesbool bool_d: PropTypesbool;
Writing other prop-types
instanceOf
, oneOfType
, arrayOf
, objectOf
, shape
, any
; const propTypes =
It equals to:
const propTypes = requiredObjectWithShape: PropTypesshape color: PropTypesstring fontSize: PropTypesnumber isRequired optionalObjectWithShape: PropTypesshape color: PropTypesstring fontSize: PropTypesnumber ;
test
npm inpm test