ESLint в VSC не работает для файлов .ts и .tsx

Question

У меня установлено расширение ESLint в VSC, и оно отлично работает для файлов .js. Теперь я представил Typescript в своем проекте React, ESLint больше не работает на лету в VSC.

У меня есть файл .eslintrc в корне моего проекта, например:

{
  "parser": "@typescript-eslint/parser",
  "extends": [
    "airbnb",
    "plugin:@typescript-eslint/recommended"
  ],
  "env": {
    "browser": true,
    "node": true,
    "serviceworker": true
  },
  "parserOptions": {
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "settings": {
    "react": {
      "version": "detect"
    },
    "import/resolver": {
      "node": {
        "extensions": [".js", ".jsx", ".ts", ".tsx"]
      }
    }
  },
  "rules": {
    "@typescript-eslint/indent": ["error", 2],
    "indent": "off",
    "jsx-a11y/anchor-is-valid": ["error", {
      "aspects": ["invalidHref", "preferButton"]
    }],
    "no-console": ["error", {
      "allow": ["error", "info"]
    }],
    "react/no-danger": 0
  }
}

У меня есть скрипт npm, который выглядит следующим образом:

"scripts": {
  "eslint": "eslint . --ext .js,.jsx,.ts,.tsx",
},

Если я запускаю npm run eslint, весь проект будет правильно написан. Что мне нужно сделать, чтобы проект красовался на лету с красными волнистыми линиями в VSC?

Answer 1

Предполагая, что у вас установлено расширение eslint в коде Visual Studio, вы должны добавить следующее в ваши настройки.

    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "typescript",
        "typescriptreact",
    ],

Это заставит eslint просматривать файлы машинописного текста, а также файлы javascript.