NX 工作区：生成新库时配置.eslintrc.json 模板

Question

我将我的 NX 工作区从 TSLint 切换到 ESLint，大部分工作正常。当我创建一个新的库时，我在 lib 文件夹中得到一个 .eslintrc.json 文件，其配置非常简单，如下所示：

// .eslintrc.json file in generated lib

{ "extends": "../../.eslintrc.json", "ignorePatterns": ["!**/*"], "rules": {} }

我不想拥有这个最小文件，需要在这个生成的文件中设置更多细节和规则，所以我的问题是这个“模板”配置来自哪里，我可以在哪里调整这个文件以获得更多细节在它的后代？

对于我的 NX 工作区，我通过以下命令生成新的库：

nx g @nrwl/angular:lib <libname>

项目根文件夹中的.eslintrc.json文件如下所示：

// .eslintrc.json in project root

{
  "root": true,
  "ignorePatterns": [
    "projects/**/*"
  ],
  "overrides": [
    {
      "files": [
        "*.ts"
      ],
      "parser": "@typescript-eslint/parser",
      "parserOptions": {
        "project": [
            "tsconfig.base.json"
        ],
        "createDefaultProgram": true
      },
      "extends": [
        "plugin:@angular-eslint/recommended",
        "eslint:recommended",
        "plugin:@typescript-eslint/recommended",
        "plugin:@typescript-eslint/recommended-requiring-type-checking",
        "plugin:@angular-eslint/template/process-inline-templates"
      ],
      "rules": {
        "@angular-eslint/component-selector": [
          "error",
          {
            "type": "element",
            "prefix": "cgm",
            "style": "kebab-case"
          }
        ],
        "@angular-eslint/directive-selector": [
          "error",
          {
            "type": "attribute",
            "prefix": "cgm",
            "style": "camelCase"
          }
        ],
        "@typescript-eslint/consistent-type-definitions": "error",
        "@typescript-eslint/dot-notation": "off",
        "@typescript-eslint/explicit-member-accessibility": [
          "off",
          {
            "accessibility": "explicit"
          }
        ],
        "id-blacklist": "off",
        "id-match": "off",
        "no-underscore-dangle": "off",
        "lines-between-class-members": ["error", "always"],
        "object-curly-newline": "off",
        "max-len": ["error", { "code": 140 }],
        "import/prefer-default-export": "off",
        "linebreak-style": ["error", "windows"],
        "indent": ["error", 4],
        "no-console": "error"
      }
    },
    {
      "files": [
        "*.html"
      ],
      "extends": [
        "plugin:@angular-eslint/template/recommended"
      ],
      "rules": {}
    }
  ]
}

我的 workspace.json 文件的原理图部分如下所示：

    "schematics": {
    "@nrwl/angular": {
        "application": {
            "linter": "eslint"
        },
        "library": {
            "linter": "eslint"
        },
        "storybook-configuration": {
            "linter": "eslint"
        },
        "style": "scss"
    },
    "@nrwl/angular:application": {
        "unitTestRunner": "jest",
        "e2eTestRunner": "cypress"
    },
    "@nrwl/angular:library": {
        "unitTestRunner": "jest",
        "style": "scss"
    },
    "@nrwl/angular:component": {
        "style": "scss"
    }
},

Answer 1

目前 (v15.x)，无法修改代码，因为它是硬编码的。您可以在以下链接中找到代码：

https://github.com/nrwl/nx/blob/15.9.2/packages/angular/src/generators/add-linting/lib/create-eslint-configuration.ts

但是，您可以考虑在“安装后”阶段使用您自己的模板修补“create-eslint-configuration.ts”文件作为一种可能的解决方法。”

find node_modules -name "create-eslint-configuration.js" -path "*@nrwl/angular/src/generators/add-linting/lib/*" -print0 | xargs -0 -I{} patch {} create-eslint-configuration.js.patch || true