Vscode automatically formats code according to eslint specification

Create a new project named... In the project root .vscode Folder , Create a new... In this folder settings.json The configuration file , The specific configuration is as follows ：

{
    
  "eslint.validate": [
    "javascript",
    {
    
      "language": "html",
      "autoFix": true
    },
    {
    
      "language": "vue",
      "autoFix": true
    }
  ],
  "editor.codeActionsOnSave": {
    
      "source.fixAll.eslint": true,
      "source.organizeImports": true
  },
  "eslint.format.enable": true,
  "editor.defaultFormatter": "dbaeumer.vscode-eslint",
  "eslint.validate": [
      "javascript",
      "javascriptreact",
      "typescript",
      "typescriptreact"
  ],
  "editor.codeActionsOnSave": {
    
      "source.fixAll": true,
      "source.fixAll.eslint": true
  }
}

When the configuration is complete , You can format the code by saving the code directly in the editor , Or a button shift + alt + F Format code shortcuts .

If vscode The local configuration does not need to be uploaded to the code base , It also needs to be in the root directory of the project .gitignore Add... To the file .vscode