重温eslint常用配置

218 阅读3分钟

官方中文文档: cn.eslint.org/docs/user-g…

代码风格检测工具, 制定编码规范, 可以避免项目中的低级Bug, 产出风格统一的代码.

ESLint有以下特点:

  • 默认规则包含所有JSLint, JSHint中的存在的规则, 易迁移
  • 规则可配置性高: 可设置"警告", "错误"两个error登记,或者直接禁用
  • 包含代码风格检测的规则
  • 支持插件扩展, 自定义规则

extends

配置扩展别人已经写好的规则("extends": "eslint:recommended")

env

env 指定脚本的运行环境, 没中环境都有一组特定的预定义全局变量(比如: 配置了"browser": true, 则代码中可以直接使用window, document等浏览器特有的属性, 此时也不会有提示告警信息)

js中使用注释

在JavaScript中使用注释来指定环境, 格式如下:

/* eslint-env node, mocha */

特定插件中使用

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

globals

globals

脚本在执行期间访问的额外的全局变量

d当访问当前源文件内未定义的变量时, no-undef规则将发出警告. 配置了globals, 则不会提示

js中使用注释指定全局变量

/* global var1, var2 */
/* global var1:writeable, var2: readonly */

使用off禁用

{
    "env": {
        "es6": true
    },
    "globals": {
        "custom": "custom value"
        "Promise": "off"
    }
}

rules

启用的规则及各自的错误级别(所匹配到的文件需要符合这里的配置规则)

{
    "rules": {
        "semi": ["error", "always"],
        "qutoes": ["error", "double"]
    }
}

规则配置第一个值是错误级别, 可选值:

  • "off"0 关闭规则
  • "warn"1 将规则视为一个警告(不会影响退出码)
  • "error"2 将规则视为一个错误(退出码为1)

第二个值指该规则对应的正确写法的值或遵循的逻辑

plugins

plugins

配置定义在插件中的一个规则的时候,你必须使用 插件名/规则ID 的形式。比如:

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

支持使用第三方插件. 使用插件前, 需要使用npm安装.

配置时, 可以省略eslint-plugin-前缀

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

parser

parser

ESLint默认使用Espree作为其解析器, 可以配置指定一个不同的解析器

parserOptions

parserOptions

指定你想吃支持的JavaScript语言选项. 默认"ECMAScript5".

注意, 支持JSX语法并不等同于支持React. React对ESlint无法识别JSX语法应用特定的语义. 如果正在使用React语义并且想要React语义支持, 建议使用eslint-plugin-react.

同样的, 支持ES6语法并不意味着同事支持新的ES6全局变量或类型(比如Set等新类型). 对于ES6语法, 使用{"parserOptions": {"ecmaVersion": 6}}; 对于新的ES6全局变量, 使用{"env": {"es6": true}}, 该配置自动启用es6语法, 但前者不自动启用es6全局变量.

.eslintignore

告诉eslint忽略哪些文件或目录

不常用的配置项

root

eslint会在同目录, 父级目录依照就近原则查找配置文件, 同目录, 父级目录都有配置项, 则合并配置项并应用于当前目录下文件, 同名情况下, 以当前目录为准(Object.assign(父级配置, 同级配置))

默认情况下, eslint会查找所有父级目录里的配置文件, 一直到根目录, 当某个配置里配置了"root":true, 则停止查找父级目录.

processor

processor

插件可以提供处理器. 处理器可以从另一种文件中提取JavaScript代码, 然后让ESLint检查JavaScript代码. 或者处理器可以在预处理中转换JavaScript代码.

若要在配置文件中指定处理器,请使用 processor 键,并使用由插件名和处理器名组成的串接字符串加上斜杠。例如,下面的选项启用插件 a-plugin 提供的处理器 a-processor:

{
    "plugins": ["a-plugin"],
    "processor": "a-plugin/a-processor"
}

要为特定类型的文件指定处理器,请使用 overrides 键和 processor 键的组合。例如,下面对 *.md 文件使用处理器 a-plugin/markdown。

setting

setting

添加共享配置项, 它将提供给每一个被执行的规则