vscode 中如何配置 eslint 支持 typescript react vue 做语法检查？

vscode 安装了 vscode eslint 插件，打开一个项目目录，项目内安装并配置了 eslint ，插件会根据当前项目根目录下的 eslint rule 来检测。

如果我只是打开一个 hello.ts 文件，或者打开的项目下没有配置 eslint ，我们怎么才能使用 eslint 检测呢？

首先会判断文件所在目录下有没有 package.json，没有的话会看上一级目录下是否存在 package.json ，按照这样的规则如果我们 用户目录或者根目录 下安装并配置了 eslint 。对于项目目录下没有配置 eslint 的情况下，也能按照统一的规则的去做语法检测。

module.exports = {
  env: {
    browser: true,
    es2021: true,
    node: true,
  },
  extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
  parser: "@typescript-eslint/parser",
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: "latest",
  },
  plugins: ["@typescript-eslint"],
  rules: {},
}

如果需要支持 react / vue 的检测，只是需要安装 eslint-plugin-react / eslint-plugin-vue 依赖。

只是需要在 extends 配置上增加 plugin:react/recommended 和 plugin:vue/recommended 注意当前版本和插件的版本对应上。

这样就配置好了就能实现单个文件或者没有配置 eslint 的情况下的语法检测。