ESLint 作为ECAMScript和JavaScript 代码识别检查工具，为我们在开发过程中提供了很大的帮助，也为我们在多人协作编程的时候，提供了统一的代码风格限制方式，减少了我们在多人编写并提交同一个文件的时候，尽量减少冲突的出现次数。如果只是一个人书写代码，也能为我们提供很好的代码规范。

尽量在项目初始阶段就使用代码检查、代码风格的规范插件工具。

使用npm安装ESLint

首先是安装eslint的插件包

npm install eslint --save-dev

然后我们可以使用命令创建eslint的配置文件

npx eslint --init

根据一步一步的提示，你会得到一个配置文件  .eslintrc  

这个时候，eslint的一些基础配置就已经出来了，但是我们在书写项目中的js或ts文件的时候并不会出现自动提示，那是因为VScode工具并没有支持ESLint，所以我们还需要安装VScode的插件工具ESLint。

VScode工具安装ESLint扩展工具

VScode如何开自动检查Python语法和变量 vscode检查代码_vscode

我们只要点击安装之后，稍等一会，我们如果在js文件中书写一个不规范的代码或代码风格，这个时候工具就会出现自动提示，辅助我们进行规范的编程风格。

有的时候我们会觉得这些东西并没有多大的用处，但我们在协同开发的时候，如果没有一个统一的规范进行限制，会出现很多这样或那样的问题。

设置VScode保存文件时，自动按照ESLint风格格式化文件

VScode如何开自动检查Python语法和变量 vscode检查代码_代码风格_02

 可以看到上图是打开的设置选项的页面，文件--首选项--设置。

扩展插件ESLint的图形设置页面，就在这里进行设置，我们可以点击标号2处的按钮切换到Setting.json文件进行手动设置。

VScode如何开自动检查Python语法和变量 vscode检查代码_自动提示_03

 将下面的代码，复制到Setting.json文件的最后面，或对应代码处，这个时候再保存对应的文件，就可以自动按照ESLint风格进行保存了。

"editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
}