前言

ESLint 由 JavaScript 红宝书作者 Nicholas C. Zakas 编写， 2013 年发布第一个版本。 NCZ 的初衷不是重复造一个轮子，而是在实际需求得不到 JSHint 团队响应的情况下做出的选择：以可扩展、每条规则独立、不内置编码风格为理念编写一个 lint 工具。

中文官方网站

英文官方网站

可以去上方网站进行相关资料查阅，长话短说，直接开始入门吧~

安装

建议采用全局安装方式

npm install -g eslint

初始化

如果你的项目还没有配置文件（.eslintrc）的话，可以通过指定–init参数来生成一个新的配置文件：

eslint --init

运行eslint –init后，会在当前目录下生成一个.eslintrc文件，你可以在这个文件中配置一些规则。

配置

ESLint被设计为完全可配置的，主要有两种方式来配置ESLint：

内嵌配置：将配置信息以注释的形式写在要检验的文件内
文件配置：利用javascript、json、yml语言的语法，生成名为.eslintrc.*的配置文件，将配置信息写到文件内

文件配置方式

env：你的脚本将要运行在什么环境中

Environment可以预设好的其他环境的全局变量，如brower、node环境变量、es6环境变量、mocha环境变量等

'env': {'browser': true,'commonjs': true,'es6': true},

globals：额外的全局变量

示例：

globals: {vue: true,wx: true},

rules：开启规则和发生错误时报告的等级

示例：

'rules': {// no-var'no-var': 'error',// 要求或禁止 var 声明中的初始化'init-declarations': 2,// 强制使用单引号'quotes': ['error', 'single'],// 要求或禁止使用分号而不是 ASI'semi': ['error', 'never'],// 禁止不必要的分号'no-extra-semi': 'error',// 强制使用一致的换行风格'linebreak-style': ['error', 'unix'],// 空格2个'indent': ['error', 2, {'SwitchCase': 1}],// 指定数组的元素之间要以空格隔开(,后面)， never参数：[ 之前和 ] 之后不能带空格，always参数：[ 之前和 ] 之后必须带空格'array-bracket-spacing': [2, 'never'],// 在块级作用域外访问块内定义的变量是否报错提示'block-scoped-var': 0,// if while function 后面的{必须与if在同一行，java风格。'brace-style': [2, '1tbs', {'allowSingleLine': true}],// 双峰驼命名格式'camelcase': 2,// 数组和对象键值对最后一个逗号， never参数：不能带末尾的逗号, always参数：必须带末尾的逗号， 'comma-dangle': [2, 'never'],// 控制逗号前后的空格'comma-spacing': [2, {'before': false, 'after': true}],// 控制逗号在行尾出现还是在行首出现'comma-style': [2, 'last'],// 圈复杂度'complexity': [2, 9],// 以方括号取对象属性时，[ 后面和 ] 前面是否需要空格, 可选参数 never, always'computed-property-spacing': [2, 'never'],// TODO 关闭 强制方法必须返回值，TypeScript强类型，不配置// 'consistent-return': 0}

规则的错误等级有三种：

0或'off'：关闭规则。
1或'warn'：打开规则，并且作为一个警告（并不会导致检查不通过）。
2或'error'：打开规则，并且作为一个错误 (退出码为1，检查不通过)。

参数说明：

参数1 ：错误等级
参数2 ：处理方式

"comma-dangle": ["error", "never"],

上述配置只是简要将最基本的一些配置罗略出来，如果有需要建议去上方官网中查看。

配置代码注释方式

有时我们可能要在代码中忽略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

Preferences -> Languages & Frameworks -> JavaScript -> Code Quality Tools -> Eslint -> Enable (勾选) -> Apply -> OK

Atom

安装linter-eslint

Sublime

安装SublimeLinter

安装SublimeLinter-contrib-eslint

结语

Eslint 对于每一个开发者而言都是非常值得使用的，这样会强制你写出高质量且整洁的代码，所以建议无论大家是前端开发者、weex开发者、还是小程序开发者都建议大家讲Eslint集成进入，来提高项目的质量。

Eslint 从入门到放弃相关推荐

AI从入门到放弃2：CNN的导火索，用MLP做图像分类识别？
来源 | 腾讯知乎专栏作者 | AIoys(腾讯员工,后台工程师) 项目文档和代码在此:github项目地址: https://github.com/zsysuper/AI_Notes ▌一.前言 ...
AOP埋点从入门到放弃（二）
其实人最大悲哀莫过于知道自己想要什么,却不知道怎么坚持!最近迷恋上了死侍其实和我平时的状态差不多,以一个混子的心态去做任何事情,往往成功的概率会更大!!! 一张图片镇楼!!! 上文说到了Aspect ...
入门到放弃node系列之网络模块（二）
为什么80%的码农都做不了架构师?>>> 前言本文首发[一名打字员] 上一节我们刚刚介绍完node的HTTP和HTTPS模块,相信我们也对nodejs有了更深层次的理解,接下 ...
webpack - vue Component 从入门到放弃（三）
离上一篇已经一个星期了,人的拖延症是没法救的,今晚趁着蒙蒙春雨,来抒发抒发情感. 上一篇简单介绍了webpack的配置,这里稍微再做一一下延伸插件插件可以完成更多 loader 不能完成的功能.插 ...
CYQ.Data 从入门到放弃ORM系列：开篇：自动化框架编程思维
前言: 随着CYQ.Data 开始回归免费使用之后,发现用户的情绪越来越激动,为了保持这持续的激动性,让我有了开源的念头. 同时,由于框架经过这5-6年来的不断演进,以前发的早期教程已经太落后了,包括 ...
python ** 运算符_Python从入门到放弃运算符（2）
摘要:上一篇Python从入门到放弃-运算符(1),讲了Python的运算符中的算术运算符.赋值运算符.比较(关系)运算符,这篇继续讲Python的运算符. 逻辑运算符逻辑运算符是对真和假两种布尔值 ...
python从入门到放弃系列恶搞短片-太惨！学Python方法用错，直接从入门到放弃！...
原标题:太惨!学Python方法用错,直接从入门到放弃! 从你开始学习编程的那一刻起,就注定了以后所要走的路-从编程学习者开始,依次经历实习生.程序员.软件工程师.架构师.CTO等职位的磨砺:当你站在 ...
为什么叫python编程-月薪上万的Python编程，为什么你还没入门就放弃了？
"大家都是怎么学Python 的?我学了一个月,感觉自己怎么学都学不进去啊,还是一脸懵--学习前我有做过规划,现在连入门都不算,我应该怎么办啊!!!求大神给一个学习思路!求大神讲解入门要重点 ...
python从入门到放弃图片大全-Python 从入门到放弃（一）
Python 从入门到放弃(一) 一个没有逻辑顺序的python笔记,包括日常使用python时的总结与阅读<Python基础教程>([挪] Magnus Lie Hetland 著) 的 ...

Eslint 从入门到放弃

前言

安装

初始化

配置