Lint是什么？
* Lint 是检验代码格式工具的一个统称
* 这类工具主要做两件事情：
-- 提供编码规范；
-- 提供自动检验代码的程序，并打印检验结果
Lint发展史
随着互联网发展，网站内容更加丰富，交互更加复杂，前端项目越来越庞大；2009 年，NodeJS 的诞生使得 JavaScript 可以跑在服务端，更是让其地位更加突出，再加之 JavaScript 本身设计上存在许多缺陷，代码不严谨也可能就会触发神奇的错误。
1、JSLint 出现，确实帮助许多 JavaScript 开发者节省了不少排查代码错误的时间。但是 JSLint 的问题也很明显——几乎不可配置，所有的代码风格和规则都是内置好的。
2、JSHint 出现，它的特点就是可配置，同时文档也相对完善，而且对开发者友好。很快大家就从 JSLint 转向了 JSHint。
3、后来，Zakas 大佬发现 JSHint 也无法满足自己定制化规则的需求了，设想发明一个基于 AST 的 lint，可以动态执行额外的规则，同时可以很方便的扩展规则。
2013 年的 6 月份，Zakas发布了全新的 lint 工具——ESLint。ESLint 的出现并没有撼动 JSHint 的霸主地位。由于前者是利用 AST 处理规则，用 Esprima 解析代码，执行速度要比只需要一步搞定的 JSHint 慢很多；其次当时已经有许多编辑器对 JSHint 支持完善，生态足够强大。
真正让 ESLint 逆袭的是 ECMAScript 6 的出现。2015 年 6 月，ES2015 规范正式发布。但是发布后，市面上浏览器对最新标准的支持情况极其有限。如果想要提前体验最新标准的语法，就得靠 Babel 之类的工具将代码编译成 ES5 甚至更低的版本，同时一些实验性的特性也能靠 Babel 转换。这时 JSHint 就略尴尬，ES2015 变化很大，短期内无法完全支持。ESLint 可扩展的优势一下就体现出来了，不仅可以扩展规则，甚至连解析器也能替换。Babel 团队就为 ESLint 开发了 babel-eslint 替换默认解析器，让 ESLint 率先支持 ES2015 语法。
2016 年，JSCS 开发团队认为 ESLint 和 JSCS 实现原理太过相似，而且需要解决的问题也都一致，最终选择合并到 ESLint，并停止 JSCS 的维护。 至此，ESLint 完美躺赢，替代 JSHint 成为前端主流工具。
ESLint简介
ESLint是一个用来识别 ECMAScript 并且按照规则给出报告的代码检测工具，使用它可以避免低级错误和统一代码的风格。
ESLint完全可配置，主要有两种方式来配置ESLint：
1、 在注释中配置：使用JavaScript注释直接把配置嵌入到JS文件中。
2、 配置文件：使用下面任一的文件来为全部的目录和它的子目录指定配置信息。
-- javascript：使用.eslintrc.js文件并导出一个包含配置的对象。
-- package.json：在package.json文件中创建eslintConfig属性，所有的配置包含在此属性中。
-- YAML：.eslintrc.yaml或者.eslintrc.yml JSON：.eslintrc.json，并且此文件允许使用JS形式的注释
这些文件的优先级则是按照以上出现的顺序（.eslintrc.js > .eslintrc.yaml > .eslintrc.yml > .eslintrc.json > .eslintrc > package.json）。
可以被配置的信息主要分为3类：
Environments： javascript 脚步将要运行在什么环境（如：nodejs，browser，commonjs等）。
Globals：执行代码时脚步需要访问的额外全局变量。
Rules：开启某些规则，也可以设置规则的等级。
文件配置方式
env：你的脚本将要运行在什么环境中
Environment可以预设好的其他环境的全局变量，如brower、node环境变量、es6环境变量、mocha环境变量等
'env': {
'browser': true,
'commonjs': true,
'es6': true
},
globals：额外的全局变量
globals: {
vue: true,
wx: true
},
rules：开启规则和发生错误时报告的等级
规则的错误等级有三种：
0或’off’：关闭规则。
1或’warn’：打开规则，并且作为一个警告（并不会导致检查不通过）。
2或’error’：打开规则，并且作为一个错误 (退出码为1，检查不通过)。
参数说明：
参数1 ： 错误等级
参数2 ： 处理方式
配置代码注释方式
有时我们可能要在代码中忽略eslint的某种检查，或者加入某种特定检查，此时我们可以用如下的方式：
示例：
忽略 no-undef 检查
/* eslint-disable no-undef */
忽略 no-new 检查
/* eslint-disable no-new */
设置检查
/eslint eqeqeq: off/
/eslint eqeqeq: 0/
eslint 检查指令
检查且修复
eslint * --fix
检查指定文件
eslint app.js --fix
WebStorm配置：
https://www.jianshu.com/p/f6d3a5c5d545
ESLint规则说明：
https://www.jianshu.com/p/5e6ee862d6d5
ESLint使用及配置，推荐看这篇文章
网友评论