详解 ESLint 规则，规范你的代码

在很久之前就想通过工具来规范自己的代码风格，减少程序出错的概率，如果看过我的 一个前端程序猿的Sublime Text3的自我修养 ，这篇博客的朋友，肯定知道在当时我使用 SublimeLinter-jshint 插件来规范风格，但是实际上一直懒癌发作也没去看它的文档，使用着它默认的规则。不过现在是时候切换到 ESLint 了！

作为一个

有理想有抱负

的前端工程师，只是使用默认规则，而不是看完文档了然于心，显然是不行滴 ^_^.. 团队协作时，若是团队的代码风格统一，能够大大减少沟通成本。（其实面试时和老大聊到代码规范，当时就说到用 JSHint ，或者 ESLint 等工具来统一的。。。这也算是我来填一个坑吧~）

好了，前情摘要就到这，我们开始吧！

什么是 ESLint ？

ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具，它的目标是保证代码的一致性和避免错误。在许多方面，它和 JSLint、JSHint 相似，除了少数的例外：

• ESLint 使用 Espree 解析 JavaScript。
• ESLint 使用 AST 去分析代码中的模式
• ESLint 是完全插件化的。每一个规则都是一个插件并且你可以在运行时添加更多的规则。

以上来自官网。不想再说下去，反正就是一个代码风格检测工具就对了

如何使用

1. 安装

   npm install -g eslint
   

2. 如果你第一次使用 ESLint，你必须使用 –init 命令新建一个配置文件：

   eslint --init
   

3. 使用 ESLint 检测任何 JavaScript 文件：

   eslint test.js test2.js
   

4. ESLint 中一些规则运行命令它可以帮你自动修复

   eslint test.js --fix
   

为了可以更直观的反馈，可能更多的会直接安装编辑器插件来进行错误提示，以Sublime 为例：

在 package control 中 ，先安装在 SublimeLinter ，再安装 SublimeLinter-contrib-eslint在项目目录下新建 .eslintrc 文件，自定义规则。

重新载入文件应该就生效了（不生效的话 Ctrl+Shift+P 调用命令面板 找到 sublimelinter: toggle linter 设置生效就好了），其他的编辑器异曲同工，就不再说了。

关于在如何在构建工具中使用，在这里不做说明（官网有）

规则定义

ESLint 支持几种格式的配置文件，如果同一个目录下有多个配置文件，ESLint 只会使用一个。优先级顺序如下：

1. JavaScript - 使用 .eslintrc.js 然后输出一个配置对象。
2. YAML - 使用 .eslintrc.yaml 或 .eslintrc.yml 去定义配置的结构。
3. JSON -使用 .eslintrc.json 去定义配置的结构，ESLint 的 JSON 文件允许 JavaScript 风格的注释。
4. Deprecated -使用 .eslintrc，可以使 JSON 也可以是 YAML。
5. package.json - 在 package.json 里创建一个 eslintConfig属性，在那里定义你的配置。

下面就是规则啦，本人使用了 .eslintrc 格式，说明也在里面：

{
// 环境定义了预定义的全局变量。
"env": {
//环境定义了预定义的全局变量。更多在官网查看
"browser":true,
"node":true,
"commonjs":true,
"amd":true,
"es6":true,
"mocha":true
 },
// JavaScript 语言选项
"parserOptions": {
// ECMAScript 版本
"ecmaVersion":6,
"sourceType":"script",//module
// 想使用的额外的语言特性:
"ecmaFeatures": {
// 允许在全局作用域下使用 return 语句
"globalReturn":true,
// impliedStric
"impliedStrict":true,
// 启用 JSX
"jsx":true
 }
 },
/**
 * "off" 或 0 - 关闭规则
 * "warn" 或 1 - 开启规则，使用警告级别的错误：warn (不会导致程序退出),
 * "error" 或 2 - 开启规则，使用错误级别的错误：error (当被触发的时候，程序会退出)
 */
"rules": {


// 可能的错误 //


// 禁止条件表达式中出现赋值操作符
"no-cond-assign":2,
// 禁用 console
"no-console":0,
// 禁止在条件中使用常量表达式
// if (false) {
// doSomethingUnfinished();
// } //cuowu
"no-constant-condition":2,
// 禁止在正则表达式中使用控制字符 ：new RegExp("\x1