如何在文件中禁用 ESLint react/prop-types 规则？答案

【问题标题】：How to disable ESLint react/prop-types rule in a file?如何在文件中禁用 ESLint react/prop-types 规则？
【发布时间】：2015-09-06 01:49:15
【问题描述】：

我将React 和ESLint 与eslint-plugin-react 一起使用。

我想将disable prop-types 规则放在一个文件中。

var React = require('react'); 
var Model = require('./ComponentModel');

var Component = React.createClass({
/* eslint-disable react/prop-types */
    propTypes: Model.propTypes,
/* eslint-enable react/prop-types */
    render: function () {
        return (
            <div className="component">
                {this.props.title}
            </div>
        );
    }
});

【问题讨论】：

这能回答你的问题吗？ Turning off eslint rule for a specific file
ESLint 与您的代码反应或其他无关。我在这个 answer 中提供了所有案例（单/多行/文件、部分/所有规则）的详细答案：stackoverflow.com/a/56719951

标签： reactjs eslint

【解决方案1】：

如果您只有一个文件想要禁用 prop-type 验证，您可以使用：

/* eslint react/prop-types: 0 */

如果您有多个文件，您可以在根目录中的 .eslintrc 文件中添加一条规则来禁用 prop-type 验证：

{
 "plugins": [
     "react"
  ],
  "rules": {
    "react/prop-types": 0
  }
}

有关更多规则，您可以查看解决了我的问题的 this link，不便之处，您还可以阅读 eslint-plugin-react 的 github 文档，了解如何使用各种选项禁用或启用它。

【讨论】：

"react/prop-types": "off" 也可以（而且可读性更强）

【解决方案2】：

只需将其放在文件顶部即可：

/* eslint-disable react/prop-types */

【讨论】：

试过了，效果很好。这是一种更清洁的方法。谢谢。
我建议不要使用0，而是使用off。在与许多不同技能水平的开发人员合作时，最好是明确的，而不是要求他们知道0 代表off。

【解决方案3】：

我必须这样做：

/* eslint react/forbid-prop-types: 0 */

这不对我有用：

/* eslint react/prop-types: 0 */

在您的 .eslintrc 文件中全局禁用（旧版本 v6.0 或更低版本）：

{
    "rules": {
        "react/forbid-prop-types": 0
    }
}

要在 .eslintrc 文件中全局禁用（v6.0 以上的新版本）：

{
    "rules": {
        "react/prop-types": 0
    }
}

【讨论】：

关于 2020 年的规则部分不正确。使用 ` "rules": { "react/prop-types": 0 } `

【解决方案4】：

我不得不用 eslint ignore cmets 包裹整个组件。

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 */

【讨论】：

我的英雄。这解决了为什么我在将第一个组件包装在其中时无法获得 /* eslint-disable react/no-multi-comp */ 的原因。
/* eslint-disable react/prop-types */ 应该放在文件的开头

【解决方案5】：

有时我的小组件与主要组件在同一个文件中。那里 propTypes 似乎有点矫枉过正。然后我通常会做这样的事情

// 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>);

【讨论】：

【解决方案6】：

我必须在我的 .eslintrc 配置文件中执行此操作以禁用道具类型验证错误。

"rules": {
  "react/prop-types": "off"
}

【讨论】：