解析错误：已为 @typescript-eslint/parser 设置了“parserOptions.project”。该文件与您的项目配置不匹配：.eslintrc.js

Question

我刚刚使用 create-react-app 启动了一个新的 typescript react 应用程序，然后安装了 firebase。我跑了firebase init，选择了typescript选项，启用了es lint并启用了函数。

当我取消注释functions/index.ts 中的样板函数代码时，我注意到VS Code 中有一些警告...

函数/eslintrc.js：

给出错误：“解析错误：“parserOptions.project”已为@typescript-eslint/parser 设置。 该文件与您的项目配置不匹配：.eslintrc.js。 该文件必须包含在至少一个提供的项目中”

函数/tsconfig.json：

functions/src/index.ts:

给出错误：“解析错误：'--jsx' 选项的参数必须是：'preserve'、'react-native'、'react'.eslint”

函数/package.json：

{
  "name": "functions",
  "scripts": {
    "lint": "eslint --ext .js,.ts .",
    "build": "tsc",
    "serve": "npm run build && firebase emulators:start --only functions",
    "shell": "npm run build && firebase functions:shell",
    "start": "npm run shell",
    "deploy": "firebase deploy --only functions",
    "logs": "firebase functions:log"
  },
  "engines": {
    "node": "14"
  },
  "main": "lib/index.js",
  "dependencies": {
    "firebase-admin": "^9.8.0",
    "firebase-functions": "^3.14.1"
  },
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^3.9.1",
    "@typescript-eslint/parser": "^3.8.0",
    "eslint": "^7.6.0",
    "eslint-config-google": "^0.14.0",
    "eslint-plugin-import": "^2.22.0",
    "firebase-functions-test": "^0.2.0",
    "typescript": "^3.8.0"
  },
  "private": true
}

我不明白这些错误。有人可以帮忙吗？

谢谢

Answer 1

TypeScript ESLint 的第一个错误与无法找到与您的函数匹配的项目 tsconfig.json 有关。

要解决这个问题，我们需要通过编辑您的 parserOptions 来告诉 TypeScript ESLint 另一个 tsconfig.json 在哪里。

.eslintrc.js

// [...]
"parser": "@typescript-eslint/parser",
"parserOptions": {
  "project": [
    "./tsconfig.json",
    "./functions/tsconfig.json",
  ]
}
// [...]

要为您的 React 文件修复与 JSX 相关的解析问题，您必须将 jsx compiler option 添加到包含 JSX 的 tsconfig.json 配置中。这很可能是您的非函数配置，对于 React v17+，您很可能需要将其设置为 react-jsx，对于 Create React App，您很可能需要将其设置为 react。

tsconfig.json

{
  "compilerOptions": {
    "jsx": "react-jsx"
    // [...]
  }
  // [...]
}