vscode上配置eslint格式化代码使用的Prettier 插件，一键格式化。

webstorm上的配置流程如下：https://blog.csdn.net/qq_29329037/article/details/80100450

 

右键点击设置键盘快捷键。。可自动配置  根据eslink 格式化

文章目录
ESLint
Prettier

ESLint
首先, 装上 Webstorm 插件

这里选择自动即可, 只要 npm 安装了, 就会自动找路径

Prettier
先安装插件




此时, prettier 的webstorm插件的格式化快捷键为 Ctrl+Alt+Shift+L
文件监视  -> 保存时自动格式化
这里没有调好… 先放上, 待改!

JavaScript 的代码检查工具有：JSLint，JSHint， JSCS， ESLint，本文着重介绍 ESLint。
ESLint 在一系列的代码质量检查工具中，是最年轻的一个，当然也是最现代化的。配置多样，支持 JavaScript， JSON 以及 YAML 格式的.eslintrc.*文件，同时也支持在package.json用eslintConfig字段配置(Configuration File Formats)。
安装
ESLint 基于 Node 平台，所以 Nodejs 是必须安装的，然后通过 npm 安装 ESLint 包，至于全局安装还是作为开发依赖安装，取决于个人。
然后在 WebStorm 中，打开设置(File>Setting或者Alt+F7)，按路径进入 ESLint 的配置界面(Languages&Frameworks>JavaScript>Code Quality Tools>ESLint)。开启 ESLint，并配置相应路径，配置文件默认使用.eslintrc。
配置
ESLint 的配置分为六大块，分别是：
Parser Options(解析器选项)。涉及语言版本等参数。ESLin t默认只支持 ES5，如果需要支持 ES6，需要在这配置。
Parser(解析器选择)。可以让你自己选择ESLint的解析器。ESLint 默认使用Espress作为作为解析器，强烈不推荐修改
Environments(语言环境选项)。比如borwser，node，jquery，meteor等等
Globals(全局变量)。比如你自己写了插件，需要全局使用，需要在这个选项中声明。
Plugins(第三方插件)。引入的第三方插件，为了防止误杀，需要在这个选项中申明(但限于 npm 插件，如果是 jquery 插件等前端插件，建议在Globals选择中声明)。
Rules(语法规则)。这个是 ESLint 的重点，同时也是整个配置中最丰富的地方，比如结尾分号检测，单双引号，严格格式等。
语法规则(Rules)配置
在官方文档中，语法规则的配置又分六大类：
语法规则(Rules)配置
在官方文档中，语法规则的配置又分六大类：
使用键值对编写，语言规则字段(rule ID)作为键，通过不同的值来影响规则字段。规则字体的值必须是以下三种之一：
"off" 或者0——不检查这个规则
"warn"或者1——开启这个规则，规则生效时，作为提醒告诉用户
"error"或者2——开启这个规则，规则生效时，作为错误告诉用户
用以下简短的规则配置做说明：
1
2
3
4
5
6
7
{
"rules":{
"quotes":["2","single"],
"no-undef":[2],
"no-multi-spaces":[1]
}
}
这个配置规则对应如下：
要求使用单引号，如果不是，显示错误信息
如果使用了未声明的变量，显示错误信息
如果变量与操作符之间出现多个空格，显示提醒信息
.eslintignore
如果你有 Git 的使用经验，那.eslintignore文件的功能也就很容易理解了。类似于.gitignore，用于排除文件与目录，比如npm的node_modules目录等，以及一些第三方插件。对于这些目录与文件，不执行代码质量检查。
开始介绍EsLint的详细用法
parserOptions
EsLint通过parserOptions，允许指定校验的ecma的版本，及ecma的一些特性
{
"parserOptions": {
"ecmaVersion": 6, //指定ECMAScript支持的版本，6为ES6
"sourceType": "module", //指定来源的类型，有两种”script”或”module”
"ecmaFeatures": {
"jsx": true//启动JSX
},
}
}
Parser
EsLint默认使用esprima做脚本解析，当然你也切换他，比如切换成babel-eslint解析
{
"parser": "esprima" //默认，可以设置成babel-eslint，支持jsx
}
Environments
Environment可以预设好的其他环境的全局变量，如brower、node环境变量、es6环境变量、mocha环境变量等
{
"env": {
"browser": true,
"node": true
}
}
如果你想使用插件中的环境变量，你可以使用plugins指定，如下
{
"plugins": ["example"],
"env": {
"example/custom": true
}
}
Globals
指定你所要使用的全局变量，true代表允许重写、false代表不允许重写
{
"globals": {
"var1": true,
"var2": false
}
}
Plugins
EsLint允许使用第三方插件
{
"plugins": [
"react"
]
}
Rules
自定义规则，一般格式：”规则名称”:error级别系数。系数0为不提示(off)、1为警告(warn)、2为错误抛出(error)，可指定范围，如[1,4]
可以包括Strict模式、也可以是code的方式提醒，如符号等。还可以是第三方的校验，如react。
{
"plugins": [
"react"
],
"rules": {
//Javascript code 默认校验
"eqeqeq": "off", //off = 0
"curly": "error", //error = 2
"quotes": ["warn", "double"], //warn = 1
//使用第三方插件的校验规则
"react/jsx-quotes": 0
}
}