eslint - Gatsby 扩展 ESLint 规则覆盖原始 ESLint

Question

我遵循文档中的说明 https://www.gatsbyjs.org/docs/eslint/ ，并想覆盖其中一条规则，但不影响其他规则，我所做的是创建一个 .eslintrc.js 文件。

这是文件的内容

module.exports = {
  globals: {
    __PATH_PREFIX__: true,
  },
  extends: `react-app`,
  "rules": {
    'jsx-a11y/no-static-element-interactions': [
      'error',
      {
        handlers: [
          'onClick',
          'onMouseDown',
          'onMouseUp',
          'onKeyPress',
          'onKeyDown',
          'onKeyUp',
        ],
      },
    ],
  }
}

但是其余的规则现在被忽略了，就像它不是一个扩展

Answer 1

虽然上面的答案是正确的，但有点不完整。问题是 eslint 可以集成到构建和编辑器中。

当您开始使用自定义 .eslintrc.js 时，您将失去基于这些规则在终端中构建和输出的集成。这是因为当您使用自定义文件时，内置的 eslint-loader 被禁用。它实际上在文档页面上是这样说的，但有点不清楚。

要取回它，您需要将它集成到 webpack 构建中。最简单的方法是使用 plugin在文档页面上提到:gatsby-plugin-eslint。

我提交了一份 issue使自定义集成更容易。