To fix ESLint error missing in props validation with React, we can add a comment or disable the rule globally with a config. to disable prop type check for the line immediately below the comment in our code. in . eslintrc to disable the prop type validation rule for the whole project.
log() statements that ESLint doesn't like. To temporarily turn off ESLint, you should add a block comment /* eslint-disable */ before the lines that you're interested in: /* eslint-disable */ console. log('JavaScript debug log'); console.
if you have only one file you want to disable prop-type validation you can use:
/* eslint react/prop-types: 0 */
in cases where you have multiple files you can add to your .eslintrc
file in your root directory a rule to disable prop-type validation:
{
"plugins": [
"react"
],
"rules": {
"react/prop-types": 0
}
}
for further rules you can checkout this link that solved my issue and for inconvenience you can also read up from eslint-plugin-react's github documentation about how to disable or enable it with various options.
Just put this on top of your file:
/* eslint-disable react/prop-types */
I had to do:
/* eslint react/forbid-prop-types: 0 */
this did not work for me:
/* eslint react/prop-types: 0 */
To disable globally in your .eslintrc file (old version v6.0 or below):
{
"rules": {
"react/forbid-prop-types": 0
}
}
To disable globally in your .eslintrc file (new version above v6.0):
{
"rules": {
"react/prop-types": 0
}
}
I had to wrap the whole component with the eslint ignore comments.
var React = require('react');
var Model = require('./ComponentModel');
/* eslint-disable react/prop-types */
var Component = React.createClass({
propTypes: Model.propTypes,
render: function () {
return (
<div className="component">
{this.props.title}
</div>
);
}
});
/* eslint-enable react/prop-types */
Sometimes I have small components in the same file as the major one. There propTypes seems overkill. Then I usually do something like this
// eslint-disable-next-line react/prop-types
const RightArrow = ({ onPress, to }) => (<TouchableOpacity onPress={() => onPress(to)} style={styles.rightArrow}><Chevrons.chevronRight size={25} color="grey" /></TouchableOpacity>);
I had to do this in my .eslintrc
config file to disable prop types validation error.
"rules": {
"react/prop-types": "off"
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With