ESlint 被设计为完全可配置的,这意味着你可以关闭每一个规则而只运行基本语法验证,或混合和匹配 ESLint 默认绑定的规则和你的自定义规则,以让 ESLint 更适合你的项目。有两种主要的方式来配置
- Configuration Comments - 使用 JavaScript 注释把配置信息直接嵌入到一个代码源文件中。
/*eslint for-direction: "error"*/
for (var i = 0; i < 10; i--) {
}
- Configuration Files - 使用 JavaScript、JSON 或者 YAML 文件为整个目录(处理你的主目录)和它的子目录指定配置信息。可以配置一个独立的
.eslintrc.*
[.eslintrc.js or .eslintrc.json or .eslintrc.yml or .eslintrc.yaml ]文件,或者直接在package.json
文件里的eslintConfig
字段指定配置,ESLint 会查找和自动读取它们,再者,你可以在命令行运行时指定一个任意的配置文件。
如果你在你的主目录(通常 ~/
)有一个配置文件,ESLint 只有在无法找到其他配置文件时才使用它。
有很多信息可以配置:
Environments - 指定脚本的运行环境。每种环境都有一组特定的预定义全局变量。
Globals - 脚本在执行期间访问的额外的全局变量。
Rules- 启用的规则及其各自的错误级别。
所有这些选项让你可以细粒度地控制 ESLint 如何对待你的代码
Specifying Parser Options 指定解析参数
ESLint默认支持ECMAScript 5, 可以自定义参数覆盖该设置,以启用对 ECMAScript 其它版本和 JSX 的支持。
注意
对 JSX 语法的支持不用于对 React 的支持。React 使用了一些特定的 ESLint 无法识别的 JSX 语法。如果你正在使用 React 并且想要 React 语义支持,我们推荐你使用 eslint-plugin-react。
使用{ "parserOptions": { "ecmaVersion": 6 } }
来启用 ES6 语法支持;
要额外支持新的 ES6 全局变量,使用 { "env":{ "es6": true } }
(这个设置会同时自动启用 ES6 语法支持)
使用 parserOptions 属性来设置解析器,可用的选项有:
-
ecmaVersion
- 设置为3,5(默认), 你可以使用 6、7、8 或 9 来指定你想要使用的 ECMAScript 版本。你也可以用使用年份命名的版本号指定为 2015(同 6),2016(同 7),或 2017(同 8)或 2018(同 9) -
sourceType
- 设置为"script"
(默认) 或"module"
(如果你的代码是 ECMAScript 模块)。 //导入导出的module -
ecmaFeatures
- 这是个对象,表示你想使用的额外的语言特性,参数如下:-
globalReturn
- 允许在全局作用域下使用return
语句 -
impliedStrict
- 启用全局 strict mode (如果ecmaVersion
是 5 或更高) -
jsx
- 启用 JSX -
experimentalObjectRestSpread
- 启用实验性的 object rest/spread properties 支持。(重要:这是一个实验性的功能,在未来可能会有明显改变。 建议你写的规则 不要 依赖该功能,除非当它发生改变时你愿意承担维护成本。)
-
.eslintrc.json
文件示例:
{
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"rules": {
"semi": 2
}
}
设置解析器选项能帮助 ESLint 确定什么是解析错误,所有语言选项默认都是 false。
Specifying Parser 指定解析器
ESLint 默认使用Espree作为其解析器,你可以在配置文件中指定一个不同的解析器,只要该解析器符合下列要求:
- 它必须是本地安装的一个 npm 模块。
- 它必须有兼容 Esprima 的接口(它必须输出一个
parse()
方法) - 它必须产出兼容 Esprima 的 AST 和 token 对象。
以下解析器与 ESLint 兼容:
- Esprima
- Babel-ESLint - 一个对Babel解析器的包装,使其能够与 ESLint 兼容。
- typescript-eslint-parser(实验) - 一个把 TypeScript 转换为 ESTree 兼容格式的解析器,这样它就可以在 ESLint 中使用了。这样做的目的是通过 ESLint 来解析 TypeScript 文件(尽管不一定必须通过所有的 ESLint 规则)。
注意,在使用自定义解析器时,为了让 ESLint 在处理非 ECMAScript 5 特性时正常工作,配置属性 parserOptions 仍然是必须的。解析器会被传入 parserOptions,但是不一定会使用它们来决定功能特性的开关。
Specifying Environments 指定环境变量
一个环境定义了一组预定义的全局变量。可用的环境包括:
browser - 浏览器环境中的全局变量。
node - Node.js 全局变量和 Node.js 作用域。
更多详见https://eslint.bootcss.com/docs/user-guide/configuring/#configuration-file-formats
这些环境并不是互斥的,所以你可以同时定义多个。
要在你的 JavaScript 文件中使用注释来指定环境,格式如下:
/* eslint-env node, mocha */
...代码片段
要在配置文件里指定环境,使用 env 关键字指定你想启用的环境,并设置它们为 true。例如,以下示例启用了 browser 和 Node.js 的环境:
{
"env": {
"browser": true, //引入window,document等全局变量时就不会报错
"node": true
}
}
或在 package.json 文件中:
{
"name": "mypackage",
"version": "0.0.1",
"eslintConfig": {
"env": {
"browser": true,
"node": true
}
}
}
在 YAML 文件中:
---
env:
browser: true
node: true
如果你想在一个特定的插件中使用一种环境,确保提前在 plugins 数组里指定了插件名,然后在 env 配置中不带前缀的插件名后跟一个 / ,紧随着环境名。例如:
{
"plugins": ["example"],
"env": {
"example/custom": true
}
}
或在 package.json 文件中
{
"name": "mypackage",
"version": "0.0.1",
"eslintConfig": {
"plugins": ["example"],
"env": {
"example/custom": true
}
}
}
在 YAML 文件中:
---
plugins:
- example
env:
example/custom: true
Configuring Plugins 插件配置
ESLint 支持使用第三方插件。在使用插件之前,你必须使用 npm 安装它。
在配置文件里配置插件时,可以使用 plugins 关键字来存放插件名字的列表。插件名称可以省略 eslint-plugin- 前缀。
{
"plugins": [
"plugin1",
"eslint-plugin-plugin2"
]
}
在 YAML 中:
plugins:
- plugin1
- eslint-plugin-plugin2
注意:由于 Node.js 的 require 函数的行为,全局安装的 ESLint 实例只能使用全局安装的 ESLint 插件,本地安装的版本,只能用 本地安装 的插件。不支持混合本地和全局插件。
Configuration File Formats 配置文件格式
ESLint 支持几种格式的配置文件:
JavaScript - 使用 .eslintrc.js 然后输出一个配置对象。
YAML - 使用 .eslintrc.yaml 或 .eslintrc.yml 去定义配置的结构。
JSON - 使用 .eslintrc.json 去定义配置的结构,ESLint 的 JSON 文件允许 JavaScript 风格的注释。
(弃用) - 使用 .eslintrc,可以使 JSON 也可以是 YAML。
package.json - 在 package.json 里创建一个 eslintConfig属性,在那里定义你的配置。
如果同一个目录下有多个配置文件,ESLint 只会使用一个。优先级顺序如下:
.eslintrc.js
.eslintrc.yaml
.eslintrc.yml
.eslintrc.json
.eslintrc
package.json