Skip to content

Commit

Permalink
Adds no-unused-prop-types rule (fixes #226)
Browse files Browse the repository at this point in the history
  • Loading branch information
Evgueni Naverniouk authored and yannickcr committed Aug 25, 2016
1 parent 466bb5e commit ed1f168
Show file tree
Hide file tree
Showing 6 changed files with 2,945 additions and 2 deletions.
1 change: 1 addition & 0 deletions README.md
Expand Up @@ -96,6 +96,7 @@ Finally, enable all of the rules that you would like to use. Use [our preset](#
* [react/no-set-state](docs/rules/no-set-state.md): Prevent usage of `setState`
* [react/no-string-refs](docs/rules/no-string-refs.md): Prevent using string references in `ref` attribute.
* [react/no-unknown-property](docs/rules/no-unknown-property.md): Prevent usage of unknown DOM property (fixable)
* [react/no-unused-prop-types](docs/rules/no-unused-prop-types.md): Prevent definitions of unused prop types
* [react/prefer-es6-class](docs/rules/prefer-es6-class.md): Enforce ES5 or ES6 class for React Components
* [react/prefer-stateless-function](docs/rules/prefer-stateless-function.md): Enforce stateless React Components to be written as a pure function
* [react/prop-types](docs/rules/prop-types.md): Prevent missing props validation in a React component definition
Expand Down
66 changes: 66 additions & 0 deletions docs/rules/no-unused-prop-types.md
@@ -0,0 +1,66 @@
# Prevent definitions of unused prop types (no-unused-prop-types)

Warns you if you have defined a prop type but it is never being used anywhere.

## Rule Details

The following patterns are considered warnings:

```jsx
var Hello = React.createClass({
propTypes: {
name: React.PropTypes.string
},
render: function() {
return <div>Hello Bob</div>;
}
});

var Hello = React.createClass({
propTypes: {
firstname: React.PropTypes.string.isRequired,
middlename: React.PropTypes.string.isRequired, // middlename is never used below
lastname: React.PropTypes.string.isRequired
},
render: function() {
return <div>Hello {this.props.firstname} {this.props.lastname}</div>;
}
});
```

The following patterns are not considered warnings:

```jsx
var Hello = React.createClass({
propTypes: {
name: React.PropTypes.string
},
render: function() {
return <div>Hello {this.props.name}</div>;
}
});
```

## Rule Options

This rule can take one argument to ignore some specific props during validation.

```
...
"prop-types": [<enabled>, { customValidators: <customValidator> }]
...
```

* `enabled`: for enabling the rule. 0=off, 1=warn, 2=error. Defaults to 0.
* `customValidators`: optional array of validators used for propTypes validation.
* `skipShapeProps`: In some cases it is impossible to accurately detect whether or not a `React.PropTypes.shape`'s values are being used. Setting this option to `true` will skip validation of `PropTypes.shape`.

## About component detection

For this rule to work we need to detect React components, this could be very hard since components could be declared in a lot of ways.

For now we should detect components created with:

* `React.createClass()`
* an ES6 class that inherit from `React.Component` or `Component`
* a stateless function that return JSX or the result of a `React.createElement` call.
3 changes: 2 additions & 1 deletion index.js
Expand Up @@ -55,7 +55,8 @@ var rules = {
'require-optimization': require('./lib/rules/require-optimization'),
'no-find-dom-node': require('./lib/rules/no-find-dom-node'),
'no-danger-with-children': require('./lib/rules/no-danger-with-children'),
'style-prop-object': require('./lib/rules/style-prop-object')
'style-prop-object': require('./lib/rules/style-prop-object'),
'no-unused-prop-types': require('./lib/rules/no-unused-prop-types')
};

var ruleNames = Object.keys(rules);
Expand Down

0 comments on commit ed1f168

Please sign in to comment.