安装

npm install eslint --save-dev

初始化

./node_modules/.bin/eslint --init

执行上述命令，命令行会让你回答一下问题，包括项目的运行环境、框架等，回答后，会生成一个默认配置文件

parserOptions

指定eslint能够识别的语法，配置解析选项能够帮助eslint判断什么属于解析错误。默认情况下，eslint能够识别es5和jsx的语法，可以通过设置parserOptions选项覆盖这些默认配置。parserOptions的可配置项：

• ecmaVersion：希望能够识别的ECMAScript语法版本。指定版本即可，比如对于es6，设置此值为6或2015，其他版本依次类推。
• sourceType：默认为script，可设置为module。若设置为script，则无法在文件中使用import等。

• ecmaFeatures：指定其他可用的语言功能，可配置值：

  • globalReturn：是否允许在全局作用域中使用return语句
  • impliedStrict：是否开启全局的严格模式（在es5及更高版本可用）
  • jsx：开启jsx

需要注意的点

• 设置ecmaVersion为es6，可以让eslint识别es6的语法，但是它并不代表eslint能够识别es6中类似于Set这些新的esmaScript全局变量。需要配合设置{env:{es6:true}}使eslint识别这些全局变量。只设置ecmaVersion为es6，在使用Set等全局变量时，会遇到no-undef的eslint报错。只设置{env:{es6:true}}但是ecmaVersion小于6，则无法使用const等语法，会遇到eslintparser error的错误。
• 设置jsx为true后，能够识别jsx不代表能够识别React，React使用了一些eslint无法识别的jsx语法。若要使用React，可以使用eslint-plugin-react

parser

默认情况下，eslint使用Espree作为解析器，但是可以自行通过parser字段设置解析器。详情可见eslint官网parser配置项

env

env配置项指定了项目需要运行的环境，eslint根据env判断，哪些全局变量是可用的哪些是不可用的。比如设置了node:true后，__dirname变得可用，不然会报no-undef错误。

• 常用配置项有：node、browser、es6、mocha等，所有列表可见eslint官网配置项
• 可以同时指定多个环境
• 可以通过配置文件指定，也可以通过文件注释的方式指定，如下

/* eslint-env node, mocha */

• 除了可以使用上面node这些已提前设置好的配置项外，也可以通过plugins的方式引入环境，如下，指定plugins，然后在env中通过plugins/xx的方式引入。

{
    "plugins": ["example"],
    "env": {
        "example/custom": true
    }
}

global

在通过env设置一部分变量后，可能仍然有部分是用户需要的全局变量，此时若不进行配置，也会报no-undef的错误，所以需要通过global的配置项告诉eslint这些变量是全局变量。

• globa不仅可以告诉eslint哪些变量是全局变量，也可以告诉eslint这些全局变量是否可以变更，配置方式如下
• 可以通过文件注释的方式进行配置

/* global var1, var2 */

/* global var1:writable, var2:writable *

• 也可以通过配置文件的方式进行配置

{
    "globals": {
        "var1": "writable",
        "var2": "readonly"
    }
}

• 开启no-global-assign规则可以使eslint检测用户是否有给不允许重写的全局变量赋值，若有此行为，则会进行报错

plugins

eslint可以使用第三方插件，通过npm下载后，在配置文件中的plugins字段进行配置即可。

{
    "plugins": [
        "plugin1",
        "eslint-plugin-plugin2"
    ]
}

由于Node的require函数的特性，全局安装的eslint只能使用全局安装的插件，本地安装的eslint只能使用本地安装的插件。

rules

eslint有很多rules，每条规则可以被赋值为off(或0)、warn(或1)，error(或2)。

• 文件注释的方式配置

/* eslint eqeqeq: 0, curly: 2 */

若规则有更多配置项时，可以使用数组的方式：
/* eslint quotes: ["error", "double"], curly: 2 */

• 配置文件的方式

{
    "rules": {
        "eqeqeq": "off",
        "curly": "error",
        "quotes": ["error", "double"]
    }
}

• 配置插件提供的规则。此时记得去掉插件的eslint-plugin前缀，eslint会使用不加前缀的名称去匹配

/* eslint "plugin1/rule1": "error" */

{
    "plugins": [
        "plugin1"
    ],
    "rules": {
        "plugin1/rule1": "error"
    }
}

特定情况禁用eslint

• 使用注释的方式禁用

/* eslint-disable */

/* eslint-disable no-alert, no-console */

alert('foo'); // eslint-disable-line

overrides

使用override字段可以对特定文件使用特定规则。具体的文件路径解析规则等可以参见configuration-based-on-glob-patterns

{
  "rules": {...},
  "overrides": [
    {
      "files": ["*-test.js","*.spec.js"],
      "rules": {
        "no-unused-expressions": "off"
      }
    }
  ]
}

配置的层叠

• eslint配置的优先级： 内联文件注释配置 > 命令行配置 >本文件夹中的配置文件 > 父文件夹中的配置文件 > 跟文件夹中的.eslint.*配置文件 > 根文件夹中package.json中eslintConfig字段中的配置
• 若配置冲突，优先级高的配置覆盖优先级低的配置
• 一般来说，eslint会去寻找配置文件，直到文件系统的根目录，这会导致一些意想不到的问题（全局eslint配置可能会意外影响到本地文件夹），设置root:true会使eslint停止向上查找

配置的继承

继承规则

• 使用extends字段，配置可以继承一些已有的配置
• extends字段可以被指定为代表某个配置的字符串，或一个数组，数组中，每个后面的配置继承前面的配置
• rules覆盖继承过来的配置，可以单独覆盖其等级，也可以同时覆盖其等级和配置项。如继承的配置是"quotes": ["error", "single", "avoid-escape"]，rules中指定配置为"eqeqeq": "warn"，则最终配置为"eqeqeq": ["warn", "allow-null"]，只覆盖其等级

配置继承的方式

• 继承自eslint:recommended，eslint:recommended内置了一系列核心规则，这些核心规则只会在eslint主版本变更是会进行变动

module.exports = {
    "extends": "eslint:recommended",
}

• 继承共享配置包。共享配置包指的是一个npm包，比如eslint-config-standard，它会导出一个配置文件，可以把它下载到本地eslint可以引用到的地方，然后通过extends继承配置包中的配置（此时可以忽略掉包名的eslint-config-前缀）

module.exports = {
    "extends": "standard",
}

• 从插件继承。eslint插件，是一个npm包，里面通常会导出一系列规则。有些插件也会导出一个或多个命名配置。若需要继承插件的配置，则需要先安装插件到eslint可以引用到的地方。然后配置plugins字段和extends字段，extends字段格式为plugins:packageName/configurationName（packageName可以忽略eslint-plugin-前缀）

{
    "plugins": [
        "react"
    ],
    "extends": [
        "eslint:recommended",
        "plugin:react/recommended"
    ],
    "rules": {
       "no-set-state": "off"
    }
}

• 继承自某个文件。

{
    "extends": [
        "./node_modules/coding-standard/eslintDefaults.js",
        "./node_modules/coding-standard/.eslintrc-es6",
    ],
}

• 继承自all，配置方式为:"extends": "eslint:all"。这会启用eslint中所有内置的核心规则。这些规则会跟随eslint的发版（包括小版本和大版本）而变化。不推荐在正式项目中用这个配置，因为这会导致再升级eslint后，eslint会针对原有代码进行报错。

.eslintignore

• 可以创建.eslintignore文件，通过正则的方式，指定不进行lint的文件
• node_modules和bower_components默认忽略