Eslint jsx-quotes规则不起作用

时间:2017-03-03 19:29:45

标签: jsx eslint

eslint jsx-quotes规则在visual studio代码中不起作用。配置:

.eslintrc.json:

{
    "plugins": ["jsx"],
    "parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "rules": {
        "semi": [2, "never"],
        "jsx-quotes": ["error", "prefer-double"],
        "quotes": ["error", "single"]
    },
    "extends": "eslint:recommended"
}

我所有其他规则都在运作。

示例jsx没有抛出错误:

<div className="hero-head">
        <div className='container'>
          <div className='tabs is-centered'>
            <ul>
              <li><a>This is always at the top</a></li>
            </ul>
          </div>
        </div>
      </div>

我也尝试过将规则名称加上“jsx /”

作为前缀

我的配置错了吗?

2 个答案:

答案 0 :(得分:2)

如果要为所有文件设置此规则,请在eslint配置文件中创建规则。

  rules: {
    'jsx-quotes': [2, 'prefer-single'],
  }

或'prefer-double'为双引号。

答案 1 :(得分:1)

“jsx-quotes”规则是核心规则集的一部分。所以不需要插件或前缀。否则配置看起来不错。但是,您发布的示例不是JSX,它只是HTML。如果将其转换为有效的JSX,ESLint在线演示输出2错误: 3:18 - Unexpected usage of singlequote. (jsx-quotes)4:20 - Unexpected usage of singlequote. (jsx-quotes)代码如下:

/* eslint "jsx-quotes": ["error", "prefer-double"] */
var a = (<div className="hero-head">
  <div className='container'>
    <div className='tabs is-centered'>
      <ul>
        <li><a>This is always at the top</a></li>
      </ul>
    </div>
  </div>
</div>);