升级到 ESLint 时导入错误以定义规则

Question

我正在做一个本地项目，我已经将 Angular v9 升级到 v10 以及 TSLint 到 ESLint。 我提到了这个 github repo for migraiton https://github.com/angular-eslint/angular-eslint

所以我的项目使用了库，这意味着它确实有多个项目。 我配置了 eslintrc.json 但我发生了错误。 即将出现的第一个错误是

Definition for rule '@angular-eslint/component-selector' was not found  @angular-eslint/component-selector

即使在 *.ts 文件的每个第一行都定义了@angular-eslint/component-selector ，它也会引发该错误。

我的主库的 Eslint 它看起来像这样 eslintrc.json

{
  "root": true,
  "ignorePatterns": [
    "!**/*"
  ],

  "overrides": [
    {
      "files": [
        "*.ts"
      ],
      "parserOptions": {
        "project": [
          "**/tsconfig.json"
        ],
        "createDefaultProgram": true
      },
      "extends": [
        "plugin:@typescript-eslint/eslint-recommended",
        "plugin:@typescript-eslint/recommended"
      ],

      "rules": {
        "@angular-eslint/component-selector": [
          "error",
          {
            "prefix": "lib",
            "style": "kebab-case"
          }
        ],
        "@angular-eslint/directive-selector": [
          "error",
          {
            "prefix": "lib",
            "style": "camelCase"
          }
        ],
        "max-len": ["error", { "code": 140 }],
        "@typescript-eslint/explicit-module-boundary-types": "off",
        "@typescript-eslint/ban-ts-comment": "off",
        "@typescript-eslint/naming-convention": [
          "error",
          {
            "selector": "variable",
            "format": ["camelCase", "UPPER_CASE", "PascalCase"]
          }
        ]
      }
    },
    {
      "files": [
        "*.html"
      ],
      "rules": {
        "arrow-body-style":"error",
        "@typescript-eslint/prefer-function-type":"error"
       }
    }
  ]
}

这是我的库之一的eslintrc.json

{
  "extends": "../../.eslintrc.json",
  "ignorePatterns": [
    "!**/*"
  ],
  "overrides": [
    {
      "files": [
        "*.ts"
      ],
      "parserOptions": {
        "project": [
          "apps/login/tsconfig.app.json",
          "apps/login/tsconfig.spec.json",
          "apps/login/tsconfig.json"
        ],
        "createDefaultProgram": true
      },
      "rules": {
        "@angular-eslint/directive-selector": [
          "error",
          {
            "type": "attribute",
            "prefix": "app"
          }
        ],
        "@angular-eslint/component-selector": [
          "error",
          {
            "type": "element",
            "prefix": "app"
          }
        ]
      }
    },
    {
      "files": [
        "*.html"
      ],
      "rules": {}
    }
  ]
}

Answer 1

对于每个可能知道的人，我发现了错误。 这是因为在插件中需要添加 angular-eslint 插件。 我添加了这个

 "plugin:@angular-eslint/recommended",

它完成了这项工作。