使用 as 进行转换时，React 中的 Tsx 编译错误

问题描述

每当使用“as”在 .tsx 文件中进行转换时，就会出现以下错误。

Error

编译失败。

src\services\featureService.tsx 行 10:28：解析错误： 意外令牌，应为“;”

this.features = {} as Feature[];

.................................^

这是 package.json

{
  "name": "x","version": "0.1.0","private": true,"dependencies": {
    "@azure/msal-browser": "^2.10.0","@fortawesome/fontawesome-svg-core": "^1.2.34","@fortawesome/free-solid-svg-icons": "^5.15.2","@fortawesome/react-fontawesome": "^0.1.14","@loadable/component": "^5.14.1","@microsoft/signalr": "^5.0.2","@testing-library/jest-dom": "^5.11.9","@types/loadable__component": "^5.13.3","@types/react": "^17.0.0","@types/react-dom": "^17.0.0","axios": "^0.21.1","bootstrap": "^4.6.0","dompurify": "^2.2.6","guid-typescript": "^1.0.9","node-sass": "^4.14.1","react": "^17.0.1","react-bootstrap": "^1.4.3","react-data-table-component": "^6.11.6","react-dom": "^17.0.1","react-router-dom": "^5.2.0","react-scripts": "^4.0.1","styled-components": "^5.2.1","typescript": "^4.1.3","web-vitals": "^1.1.0"
  },"scripts": {
    "start": "react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject","eslint": "node ./node_modules/eslint/bin/eslint.js -c .eslintcr.json . --ext .tsx"
  },"browserslist": {
    "production": [
      ">0.2%","not dead","not op_mini all"
    ],"development": [
      "last 1 chrome version","last 1 firefox version","last 1 safari version"
    ]
  },"devDependencies": {
    "@types/dompurify": "^2.2.1","@types/react-router-dom": "^5.1.7"
  }
}

这是 tsconfig.json：

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

还有一个叫.eslintcr.json的文件

{
    "env": {
        "browser": true,"es6": true,"node": true
    },"extends": [
        "eslint:recommended","plugin:react/recommended"
    ],"globals": {
        "Atomics": "readonly","SharedArrayBuffer": "readonly","JSX": "true"
    },"parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },"ecmaVersion": 12,"sourceType": "module"
    },"plugins": [
        "react"
    ],"rules": {
        "indent": [
            "error",4
        ],"quotes": [
            "error","double"
        ],"semi": [
            "error","always"
        ],"no-trailing-spaces": [
            "error"
        ],"no-multi-spaces": [
            "error",{ "ignoreEOLComments": true }
        ]
    },"parser": "babel-eslint"
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）