eslint-plugin-require-exact-proptypes

An eslint plugin to enforce the usage of the prop-types-exact package by AirBnb.

Note on usage: This eslint rule requires that the prop-types-exact package be imported as exact

Rule Cases

Good

1import React from 'react';
2import PropTypes from 'prop-types';
3import exact from 'prop-types-exact';
4
5const Foo = props => <span>Bar is: { props.bar }</span>;
6
7Foo.propTypes = exact({ bar: PropTypes.string, });
8
9export default Foo;

-- or --

1import React, { Component } from 'react';
2import PropTypes from 'prop-types';
3import exact from 'prop-types-exact';
4
5export default class Foo extends Component {
6    
7    static propTypes = exact({ bar: PropTypes.string });
8
9    render() { 
10        return <span>Bar is: { props.bar }</span>;
11    }
12}

Bad

1import React from 'react';
2import PropTypes from 'prop-types';
3
4const Foo = props => <span>Bar is: { props.bar }</span>;
5
6Foo.propTypes = { bar: PropTypes.string, };
7
8export default Foo;

-- or --

1import React, { Component } from 'react';
2import PropTypes from 'prop-types';
3
4export default class Foo extends Component {
5    
6    static propTypes = { bar: PropTypes.string };
7
8    render() { 
9        return <span>Bar is: { props.bar }</span>;
10    }
11}

Installation

You'll first need to install ESLint:

$ npm i eslint --save-dev

Next, install eslint-plugin-require-exact-proptypes:

$ npm install eslint-plugin-require-exact-proptypes --save-dev

Note: If you installed ESLint globally (using the -g flag) then you must also install eslint-plugin-require-exact-proptypes globally.

Usage

Add require-exact-proptypes to the plugins section of your .eslintrc configuration file. You can omit the eslint-plugin- prefix:

1{
2    "plugins": [
3        "require-exact-proptypes"
4    ]
5}

Then configure the rules you want to use under the rules section.

1{
2    "rules": {
3        "require-exact-proptypes/require-exact-proptypes": 2
4    }
5}