我用——template typescript创建了一个新的React Native项目

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

然后我继续添加ESLint:

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

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

解析错误:"parserOptions. "已经为@typescript-eslint/parser设置了Project "。 该文件与您的项目配置不匹配:/Users/Dan/site/babel.config.js。 该文件必须包含在至少一个提供的项目中。eslint


当前回答

在我的ESLint配置中,我有以下配置:

.eslintrc.js

module.exports = {
  root: true,
  env: {
    node: true,
  },
  globals: {
    Promise: "readonly"
  },
  parser: "@typescript-eslint/parser",
  parserOptions: {
    sourceType: "module",
    tsconfigRootDir: __dirname,
    project: ["./tsconfig.eslint.json"],
  },
  plugins: ["@typescript-eslint"],
  extends: [
    "eslint:recommended",
    "prettier/@typescript-eslint",
    "plugin:@typescript-eslint/recommended",
    "plugin:@typescript-eslint/recommended-requiring-type-checking",
  ],
}

更新 修复的关键部分是:

parser: "@typescript-eslint/parser"

这:

parserOptions: {
    sourceType: "module",
    tsconfigRootDir: __dirname,
    project: ["./tsconfig.eslint.json"], // could be tsconfig.json too
}

不要忘记在tsconfig.json的include数组中包含该文件或文件的目录。

其他回答

在".eslintignore"中添加一行:

.eslintrc.js

这个错误来自VSCode扩展吗? 错误是否有一个相对路径,即使它在同一个文件夹(或子文件夹)中(如下面的错误消息所示)?

Parsing error: "parserOptions.project" has been set for @typescript-eslint/parser.
The file does not match your project config: ../../../../../home/<ommitted>/projects/floor-planner/app/src/App.vue.
The file must be included in at least one of the projects provided.

如果是,使用CLI时检查是否仍然存在。

你可以从你的项目根目录运行eslint .. 如果没有发现这些错误,则很可能是通过符号链接打开了项目。

截至2021年8月,Eslint扩展不支持Symlinks。

在项目目录中,运行pwd -P来获取绝对路径。

在我的例子中,这导致

~/projects/floor-planner/app: pwd -P
/media/projects/2021-Q3/floor-planner/app

通过此路径打开项目。

Eslint应该不再显示错误。

在本例中,我们有多个.eslintrc和多个tsconfig。Json在目录树中。(一个用于服务器,一个用于React客户端,一个用于。/client。)

这在CLI中工作得很好,但在VS Code的插件中就不行了。

修复方法是将./client/.eslintrc项目值设置为相对于根目录,而不是相对于.eslintrc文件。将“。/tsconfig. conf”改为“。/tsconfig. conf”。./client/tsconfig. Json“to”。json”,IDE检测工作如预期。

我碰巧有同样的问题一段时间,然后在添加.html到我的tsconfig的包含数组。Json文件,问题已被修复。

因为我在做一个Angular项目,所以在overrides中的files数组中,你可能会看到我的components扩展名,你可能需要根据项目的需要进行更改。

在eslintrc。Json文件,你需要有以下配置:

    "extends": [
        "plugin:@typescript-eslint/eslint-recommended",
        "plugin:@typescript-eslint/recommended",
        "plugin:@typescript-eslint/recommended-requiring-type-checking",
        "plugin:@angular-eslint/recommended"
    ],
    "overrides": [
        {
            "files": ["*.ts", "*.component.html", "*.component.ts"],
            "parserOptions": {
                "project": ["./tsconfig.json"],
                "extraFileExtensions": [".html"]
            },
            "rules": { "@typescript-eslint/prefer-nullish-coalescing": "error" }
        }
    ],
    "parser": "@typescript-eslint/parser",

确保在tsconfig中有以下行。json文件:

"include": ["**/*.d.ts", "**/*.ts", "**/*.html", "**/*.scss", "**/*.css"],

简单地通过在.eslintrc.js中添加ignorePatterns选项来指示eslint忽略它们:

module.exports = {
  root: true,
  parser: '@typescript-eslint/parser',
  parserOptions: {
    project: './tsconfig.json',
  },
  ignorePatterns: ["babel.config.js"],
  ...

由于检测您的项目配置文件没有多大价值,您可以安全地忽略它们。

另外,我不会让它们成为你的tsconfig的一部分。Json或创建一个特殊的tsconfig.eslint.json文件,仅用于检测目的。