VSCode: ESLint + Prettier 代码语法检查和格式化

介绍一下如何在 vscode 中通过 eslint + prettier 来对代码进行语法检查。目前我们的项目主要是 tsx 为主，接下来的配置说明也将以 tsx 为主。

很简单，两个插件长这样

如果只是代码格式和语法检查：在vscode Setting文件中写好相关配置就行～

{
    
    
  "editor.formatOnSave": true, // 值设置为true时，每次保存的时候自动格式化；值设置为false时，按Command+Shift+F 格式化代码
  "editor.defaultFormatter": "esbenp.prettier-vscode", //默认格式化规则（可以按语言配置）
   "editor.detectIndentation": false, //vscode默认 启用时根据文件类型自动设置tabsize的选项，设置为false
  "editor.tabSize": 2, //tab的缩进为2
  // 添加ts语法验证支持
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact"
  ],
  // vscode 中附带了ts的最新稳定版本，也可以通过该配置项 配置要使用的ts
  "typescript.tsdk": "node_modules/typescript/lib",
  // 每次保存的时候将代码按eslint进行修复 
  "editor.codeActionsOnSave": {
    
    
    "source.fixAll.eslint": true
    // 此处还可配置tslint stylelint，如下：
    //"source.fixAll.tslint": true,
   // "source.fixAll.stylelint": true
  },
}

参考文章：
Eslint
Prettier