React 项目中的 Typescript 不再识别“as”关键字

我将“react-scripts”升级到最新版本，以消除“在定义之前使用“React””错误。我还升级到了最新版本的打字稿。

现在我收到以下信息：

Failed to compile.

src\components\NearBy.tsx
Line 26:61:  Parsing error: Unexpected token, expected ","

  24 |     const [customers, setCustomers] = useState<Array<any>>([]);
  25 |     const [activeMenuIdx, setActiveMenuIdx] = useState(0);
> 26 |     const [activeCustomer, setActiveCustomer] = useState({} as ICustomerDetail);
     |                                                             ^
  27 |     const [nearBySettings, setNearBySettings] = useState({} as any);

我认为这可能是将对象强制转换为接口，但在使用“any”时，下面的行 (27) 将生成相同的错误。

包.json

{
    "name": "microsoft-teams-ext",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
        "@fluentui/react-northstar": "^0.49.0",
        "@microsoft/teams-js": "^1.6.0",
        "@types/classnames": "^2.2.11",
        "@types/react": "^16.9.53",
        "@types/react-dom": "^16.9.8",
        "@types/react-router-dom": "^5.1.6",
        "@typescript-eslint/eslint-plugin": "^4.6.1",
        "@typescript-eslint/parser": "^4.6.1",
        "bingmaps": "^2.0.3",
        "classnames": "^2.2.6",
        "msteams-react-base-component": "^2.1.0",
        "msteams-ui-styles-core": "^0.8.2",
        "react": "^16.13.1",
        "react-dom": "^16.13.1",
        "react-router-dom": "^5.1.2",
        "react-scripts": "^4.0.0-next.117",
        "typescript": "^4.0.5",
        "typescript-collections": "^1.3.3",
        "typestyle": "^2.1.0"
    },
    "resolutions": {
        "**/@typescript-eslint/eslint-plugin": "^4.6.1",
        "**/@typescript-eslint/parser": "^4.6.1"
    },
    "scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "eject": "react-scripts eject"
    },
    "browserslist": {
        "production": [
            ">0.2%",
            "not dead",
            "not op_mini all"
        ],
        "development": [
            "last 1 chrome version",
            "last 1 firefox version",
            "last 1 safari version"
        ]
    },
    "msteams": {
        "teamsAppId": "89b9dfb3-98d2-4b90-9926-2ddf8e4a6aad"
    },
    "eslintConfig": {
        "rules": {}
    }
}

tsconfig.json

{
  "compilerOptions": {
    "esModuleInterop": true,
    "jsx": "react",
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "isolatedModules": true,
    "module": "esnext",
    "moduleResolution": "node",
    "noEmit": true,
    "noFallthroughCasesInSwitch": true,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "strict": true
  },
  "include": [
    "src"
  ]
}

在中添加以下配置package.json:

"eslintConfig": {
   "extends": [
      "react-app",
      "react-app/jest"
   ]
}