programing

TypeScript 캐스트 연산자 "as"의 ESlint 구문 분석 오류 "예상하지 않은 토큰"

testmans 2023. 3. 16. 21:13
반응형

TypeScript 캐스트 연산자 "as"의 ESlint 구문 분석 오류 "예상하지 않은 토큰"

이 발생한 경우as오퍼레이터가 주다[eslint] [E] Parsing error: Unexpected token, expected ";"장소를 가리키다as. 코드 예:

{error && <small className="invalid-feedback">{(error as any).message}</small>}

이 캐스팅은any에 있는 버그에 대한 회피책입니다.react-hooks-formuseFormContext기능.

에러를 무시하고 앱을 컴파일하면 정상적으로 동작합니다.

이 문제는 최신 TypeScript 및 react-script를 사용하는 표준 Create React App에서 발생합니다.

$ npm list -dev -depth 0
frontend@0.1.0 
├── eslint-plugin-flowtype@3.13.0
├── react-hot-loader@4.12.19
├── react-scripts@3.4.0
└── typescript@3.8.2

AFAIK에는 자동 생성된 구성 파일이 없습니다.tsconfig.json:

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

왜 이런 일이 일어나는지 아십니까?

저도 비슷한 문제에 부딪혔는데, 제게 효과가 있었던 간단한 해결책은 다음과 같습니다.
이거를 제 거에 추가해서package.json:

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

나는 그것을 알아챘다.create-react-app --template typescript를 생성합니다.package.json이렇게 해서.

문제의 원인은 Coc(Vim8 및 Neovim용 인텔리센스 엔진)와 그 환경 설정 오류인 것을 알았습니다.프로젝트 외부에서 eslint를 잘못 설치했습니다.PATH를 수정하고 워크스페이스 폴더가 올바르게 인식되는지 확인해야 했습니다.

편집:react-scriptsTypeScript 지원이 추가된 기반 응용 프로그램npm install --save typescript @types/node @types/react @types/react-dom @types/jesteslint에 의한 .ts[x] 소스 파일의 보풀이 준비되지 않았습니다.수동으로 설정해야 합니다.https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/README.md 라는 가이드를 사용하고, 다음의 설정을 생각해 냈습니다..eslintrc.json):

{
    "extends": [
        "standard",
        "plugin:react/recommended",
        "plugin:@typescript-eslint/eslint-recommended",
        "plugin:@typescript-eslint/recommended"
    ],
    "parser": "@typescript-eslint/parser",
    "plugins": [
        "@typescript-eslint"
    ],
    "settings": {
        "react": {
            "pragma": "React",
            "version": "detect",
            "flowVersion": "0.53"
        }
    },
    "overrides": [
        {
            "files": ["*.js", "*.jsx"],
            "rules": {
                "@typescript-eslint/explicit-function-return-type": "off"
            }
        }
    ]
}

아마 많은 튜닝이 필요할 겁니다.

Jese를 tsx 파일과 함께 사용하려다 이 문제가 발생했습니다.as오퍼레이터입니다.저는 두 가지 간단한 방법으로 문제를 해결했습니다.

  1. 달려.npm install --save-dev @babel/preset-typescript
  2. babel.config.js의 프리셋 배열에서'@babel/preset-typescript'마지막에.

언급URL : https://stackoverflow.com/questions/60547153/eslint-parsing-error-unexpected-token-on-typescript-cast-operator-as

반응형