forbid-foreign-prop-types.md

Disallow using another component's propTypes (react/forbid-foreign-prop-types)

This rule forbids using another component's prop types unless they are explicitly imported/exported. This allows people who want to use babel-plugin-transform-react-remove-prop-types to remove propTypes from their components in production builds, to do so safely.

In order to ensure that imports are explicitly exported it is recommended to use the "named" rule in eslint-plugin-import in conjunction with this rule.

Rule Details

This rule checks all objects and ensures that the propTypes property is not used.

Examples of incorrect code for this rule:

import SomeComponent from './SomeComponent';
SomeComponent.propTypes;

var { propTypes } = SomeComponent;

SomeComponent['propTypes'];

Examples of correct code for this rule:

import SomeComponent, {propTypes as someComponentPropTypes} from './SomeComponent';

Rule Options

...
"react/forbid-foreign-prop-types": [<enabled>, { "allowInPropTypes": [<boolean>] }]
...

allowInPropTypes

If true, the rule will not warn on foreign propTypes usage inside a propTypes declaration.

When Not To Use It

This rule aims to make a certain production optimization, removing prop types, less prone to error. This rule may not be relevant to you if you do not wish to make use of this optimization.

If you are writing a higher-order component that hoists the wrapped component's propTypes, you might want to disable this rule.