vscode中如何加eslint检查工具

    代码的质量对开发人员个人的成长以及公司的发展至关重要，所以如何使用把控代码的质量是大家经常思考的问题。除了代码审核之外，代码检查工具成了把控代码质量的第一道门槛，非常好用，可以建立一些团队约定的代码风格，也可以使用比较经典、标准的语法规则。

    以下主要介绍vscode中eslint是如何使用的？

     第一步：vscode先安装eslint插件，如下图：

      

      第二步：全局安装eslint，使用命令如下：

npm i -g eslint

      第三步：初始化eslint，生成.eslintrc.js文件，使用命令如下

eslint --init

     输入完命令，按回车之后，我们按照提示，一步一步选择自己所需就行，最后会生成.eslintrc.js文件，如下图：

     eslint里面的规则，可以自己设置，具体怎么设置，可以参考eslint官网-规则设置案例

    第四步：如果你写VUE，最好安装vetur插件和Prettier - Code formatter插件，然后在vscode编辑器里设置，具体如下

  

{
    //.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保存的时候，编辑器会自动把代码按照既定的规则进行格式化，省了很多事儿~