"parserOptions.project“已为@typescript-eslint/解析器设置。

Question

我用--template typescript创建了一个新的

我删除了作为样板的一部分的template目录。

然后，我继续添加ESLint：

module.exports = {
  parser: "@typescript-eslint/parser",
  plugins: ["@typescript-eslint"],
  extends: ["airbnb-typescript-prettier"]
};

然而，当我打开babel.config.js时，我会得到这个错误

解析错误："parserOptions.project“已设置为@parserOptions.project/解析器。 该文件不匹配您的项目配置：/Users/Dan/site/babel.config.js。 该文件必须至少包含在其中一个项目provided.eslint中。

Answer 1

JavaScript和TypeScript文件的不同链接规则

出现这个问题的原因之一如下：

1. 您所使用的规则需要类型的信息，并且没有指定parserOptions.project；
2. 您指定了parserOptions.project，没有指定createDefaultProgram (它将在将来的版本中删除。)，并且正在对未包含在项目中的文件进行链接(例如babel.config.js、metro.config.js)

来自TypeScript ESLint Parser docs

parserOptions.project 此选项允许您提供项目tsconfig.json的路径。如果要使用要求类型信息的规则，则需要此设置。 (...) 请注意，如果指定了此设置而没有指定createDefaultProgram，则必须只将链接文件包括在由所提供的tsconfig.json文件定义的项目中。如果您的现有配置没有包括您想要链接的所有文件，则可以创建一个单独的tsconfig.eslint.json。

要解决这个问题，请更新ESLint配置，以便只对TypeScript文件使用TypeScript规则：

{
  // ...
  parser: '@typescript-eslint/parser',
  plugins: ["@typescript-eslint"],
  overrides: [
    {
      files: ['*.ts', '*.tsx'], // Your TypeScript files extension

      // As mentioned in the comments, you should extend TypeScript plugins here,
      // instead of extending them outside the `overrides`.
      // If you don't want to extend any rules, you don't need an `extends` attribute.
      extends: [
        'plugin:@typescript-eslint/recommended',
        'plugin:@typescript-eslint/recommended-requiring-type-checking',
      ],

      parserOptions: {
        project: ['./tsconfig.json'], // Specify it only for TypeScript files
      },
    },
  ],
  // ...
}

您可以在正式文档：overrides上阅读更多关于重写是如何工作的？配置的信息。

不要将特定的文件粘住

如果不想链接错误中提到的文件(例如babel.config.js)，可以忽略它，将它的名称添加到文件中

babel.config.js

无论如何，上面的步骤(关于重写TypeScript文件的配置)非常重要，以防项目同时包含要链接的JavaScript和TypeScript文件。

您还可以为不同的情况创建其他重写，例如，用于测试文件的不同配置，因为它可以使用开发人员依赖项并运行在node 环境上，而不是browser上。

Answer 2

您可以创建一个单独的TypeScript配置文件(tsconfig.eslint.json)，用于eslint配置。该文件扩展了tsconfig配置，并为必须链接的文件设置了include键。

.eslint.js

// ...
parserOptions: {
  // ...
  project: "./tsconfig.eslint.json",
  // ...
},
// ...

tsconfig.eslint.json

{
  "extends": "./tsconfig.json",
  "include": [
    // ...
    "babel.config.js"
  ]
}

或者，如果您想忽略它，可以将其放入.eslintignore中。

.eslintignore

// ...
babel.config.js

Answer 3

在“.eslintignore”中添加一行：

.eslintrc.js