使用 typescript-eslint 的 VSCode 編輯器中未顯示 Typescript 錯誤

Question

我的問題是我無法使用 eslint 和 @typescript-eslint（在 MacOs 的 VSCode 上）在編輯器中顯示 typescript 錯誤。

顯示 Eslint 錯誤，但未顯示此屏幕截圖（tsx 文件）中顯示的類型錯誤

這里顯示了有關未使用變量的問題，但沒有顯示調用typedFunction時的類型錯誤。 如果我在終端中運行tsc ，則會引發錯誤。

Eslint 擴展安裝在我的 VSCode 編輯器中。 這是我的.eslintrc：

{
  "parser": "@typescript-eslint/parser",
  "extends": [
    "plugin:@typescript-eslint/recommended",
    "react-app",
    "prettier",
    "prettier/@typescript-eslint",
    "prettier/react"
  ],
  "plugins": [
    "import",
    "prefer-object-spread",
    "prettier",
    "react",
    "@typescript-eslint"
  ],
  "env": {
    "browser": true,
    "es6": true,
    "node": true
  },
  "globals": {
    "alert": true,
    "document": true,
    "localStorage": true,
    "navigator": true,
    "window": true,
    "HTMLElement": true
  },
  "rules": {
    "prettier/prettier": "error",
    "import/extensions": 0,
    "import/no-extraneous-dependencies": [
      "error",
      {
        "devDependencies": true,
        "optionalDependencies": false,
        "peerDependencies": false
      }
    ],
    "import/no-unresolved": 0,
    "import/prefer-default-export": 0,
    "prefer-object-spread/prefer-object-spread": 2,
    "react/destructuring-assignment": 0,
    "react/jsx-filename-extension": [1, { "extensions": [".ts", ".tsx"] }],
    "react/no-array-index-key": 2,
    "react/prefer-stateless-function": 0,
    "react/prop-types": 0,
    "react/require-default-props": 0,
    "@typescript-eslint/explicit-function-return-type": 0,
    "@typescript-eslint/explicit-member-accessibility": 0,
    "@typescript-eslint/camelcase": 0,
    "@typescript-eslint/interface-name-prefix": 0,
    "complexity": ["error", 8],
    "max-lines": ["error", 200],
    "max-depth": ["error", 3],
    "max-params": ["error", 4]
  }
}

我嘗試刪除所有 VSCode 擴展，卸載 VSCode，重新啟動計算機，但沒有任何效果。 我的 VSCode 版本是 1.46.0

Answer 1

在 VSC 的擴展面板中，鍵入“@builtin”並在“功能”部分中查找“TypeScript 和 JavaScript 語言功能”。 它很可能已被禁用。 啟用它並重新啟動您的 VSC。 正如 Matt Bierner 從這里建議的那樣。

Answer 2

VSCode 沒有內置的 typescript linter。 https://code.visualstudio.com/docs/languages/typescript#_linters

從市場安裝 ESlint 擴展以解決 JS 和 TS lint 錯誤。 如果已經安裝了，后期引入typescript，重新安裝ESlint擴展，重啟VSCode即可

Answer 3

您需要將tsconfig.json文件添加到您的項目中，它會起作用。 像這樣的東西

{
  "exclude": ["node_modules", "node_modules/**/*"],
  "compilerOptions": {
    "baseUrl": "./",
    "lib": ["es5", "es6", "dom", "es2018.promise"],
    "target": "es6",
    "module": "commonjs",
    "moduleResolution": "node",
    "outDir": "./build",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "sourceMap": false,
    "strict": true,
    "strictPropertyInitialization": false,
    "skipLibCheck": true, 
    "suppressImplicitAnyIndexErrors": true
  }
}

Answer 4

我終於找到了解決辦法！ 在卸載 VSCode 之前刪除/Users/<user>/Library/Application\ Support/Code文件夾，然后重新安裝它。 這刪除了以前的 VSCode 設置，而從應用程序文件夾中刪除它時並非如此。

我不知道出了什么問題，但是我之前在界面中看不到與 typescript 相關的任何內容（例如底部欄中 Typescript 旁邊使用的版本），但這解決了問題。