Skip to main content

Hoist your prop types to the top of a file for readibility

Project description

hoist-prop-types
=========

A codemod that will hoist prop types and default props to the top of the file.
Currently only works with files with one component.

### Motivation
The main purpose is to bring the more important parts of your components, `propTypes`,
to the top of the file. PropTypes help explains what your component does, almost as
much as the render method. Keeping them close to the top of your file helps minimize
scrolling and keeps your code that much more consistent.


### Input:
```javascript
import * as React from 'react';
import PropTypes from 'prop-types';

class MyComponent extends React.Component {
render() { return null; }
}

MyComponent.propTypes = {
name: PropTypes.string,
};
MyComponent.defaultProps = {
name: 'Jim'
};
```

### Output:
```javascript
import * as React from 'react';
import PropTypes from 'prop-types';

const PROPS = {
name: PropTypes.string,
};

const DEFAULT_PROPS = {
name: 'Jim'
};

class MyComponent extends React.Component {
render() { return null; }
}

MyComponent.propTypes = PROPS;
MyComponent.defaultProps = DEFAULT_PROPS;

```

`hoist-prop-types` will work with `static propTypes ={...}` that are delared in the class as well.

Install
-----------
```
pip install hoist-prop-types
```

Usage
----------
```
hoist-prop-types ./my/dir/
```

This will read all `.js` and `.jsx` files and try to hoist the prop types to the top.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Filename, size & hash SHA256 hash help File type Python version Upload date
hoist-prop-types-0.1.1.tar.gz (3.2 kB) Copy SHA256 hash SHA256 Source None

Supported by

Elastic Elastic Search Pingdom Pingdom Monitoring Google Google BigQuery Sentry Sentry Error logging AWS AWS Cloud computing DataDog DataDog Monitoring Fastly Fastly CDN SignalFx SignalFx Supporter DigiCert DigiCert EV certificate StatusPage StatusPage Status page