vscode how to add eslint inspection tool

    Code quality is critical to the development of the individual person and the company's growth and development, so how to control the quality of the code is the problem we often think about. In addition to code review, code inspection tools to control the quality of the code became the first threshold, very easy to use, can establish some code style team agreed, can also be used more classic, standard grammar rules.

    The following describes how vscode in eslint is used?

     The first step: vscode install eslint plug-in , as shown below:

      

      Step two: the overall installation eslint , using the following command:

above sea level and -g eslint

      The third step: initialization eslint, generating .eslintrc.js file , using the following command

eslint --init

     Finished entering commands, then press Enter, we follow the instructions, step by step, to choose their desired on the line, will eventually generate .eslintrc.js file, as shown below:

     eslint inside the rules, they can set up their own, specifically how to set up, you can refer eslint official website - Setting Rules Case

    Step Four: If you write VUE, the best plugins and install vetur Prettier - Code formatter plugin , then set vscode editor, as follows

  

{
    //.vue文件template格式化支持，并使用js-beautify-html插件
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    //js-beautify-html格式化配置，属性强制换行
    "vetur.format.defaultFormatterOptions": {
      "js-beautify-html": {
        "wrap_attributes": "force-aligned"
      }
    },
    //根据文件后缀名定义vue文件类型
    "files.associations": {
      "*.vue": "vue"
    },
    //配置 ESLint 检查的文件类型
    "eslint.validate": [
      "javascript",
      "javascriptreact",
      {
        "language": "vue",
        "autoFix": true
      }
    ],
    //保存时eslint自动修复错误
    "eslint.autoFixOnSave": true,
    //保存自动格式化
    "editor.formatOnSave": true
}

      这样弄好之后，ctrl+s保存的时候，编辑器会自动把代码按照既定的规则进行格式化，省了很多事儿~