为什么react-scripts有可选链接的编译错误？

Question

我已经将typescript升级到了3.7以上，这也是可选链接出现的时候。react-scripts也是最新的。然而，当我运行npm run build时，下面的代码行仍然抛出以下错误

> react-scripts build

Creating an optimized production build...
Failed to compile.

./src/myfile.tsx
  Line 172:25:  Parsing error: Expression expected

下面是“冒犯”的一句话：

   const result = item.get(first)?.get(second);

这是我的package.json：

{

  project details...

  "dependencies": {

    other dependencies here...

    "react-scripts": "^3.4.3",
    "@typescript-eslint/parser": "^2.5.0",
    "cross-env": "6.0.3",
    "typescript": "^3.7.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "cross-env CI=true react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

这是我的tsconfig.json：

{
  "compilerOptions": {
    "baseUrl": "src",
    "target": "es2020",
    "allowJs": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve",
    "lib": ["es2020", "dom"],
    "skipLibCheck": false
  },
  "include": ["src"]
}

我的IDE (VS Code)中没有任何弯弯曲曲的线条，所以至少可以正确地读取它。

我怎样才能让可选的链接在这里玩得很好呢？react-scripts是否忽略我的package.json中的tsconfig.json和/或typescript？

Answer 1

该错误提示了问题所在：Parsing error

尽管react-scripts和typescript被设置为正确的版本，但eslint包需要更新。运行npm i eslint@^6.6解决了此问题。