ESLint

ESLint是一个用来识别 ECMAScript 而且按照规则给出报告的代码检测工具，使用它能够避免低级错误和统一代码的风格。ESLint被设计为彻底可配置的，主要有两种方式来配置ESLint：

• 在注释中配置：使用JavaScript注释直接把配置嵌入到JS文件中。
• 配置文件：使用下面任一的文件来为所有的目录和它的子目录指定配置信息。
  • javascript：使用.eslintrc.js文件并导出一个包含配置的对象。
  • YAML：.eslintrc.yaml或者.eslintrc.yml
  • JSON：.eslintrc.json，而且此文件容许使用JS形式的注释
  • 废弃的用法：.eslintrc，此文件能够是JSON或者YAML
  • package.json：在package.json文件中建立eslintConfig属性，全部的配置包含在此属性中。

这些文件的优先级则是按照以上出现的顺序（.eslintrc.js > .eslintrc.yaml > .eslintrc.yml > .eslintrc.json > .eslintrc > package.json）。

能够被配置的信息主要分为3类：

• Environments：你的 javascript 脚步将要运行在什么环境（如：nodejs，browser，commonjs等）中。
• Globals：执行代码时脚步须要访问的额外全局变量。
• Rules：开启某些规则，也能够设置规则的等级。

安装

---

• 全局安装

npm i -g eslint

• 局部安装（推荐）

npm i -D eslint

安装完毕后，接下来新建一个配置文件.eslintrc.js，或者使用以下的命令行来自动生成。

eslint --init

配置

---

指定执行环境

JavaScript 代码能够运行在浏览器或 nodejs 等环境中，每一个环境的全局变量都不尽相同（如 nodejs 中没有 DOM 相关的全局变量）。在配置文件中能够自由的指定执行环境。

// .eslintrc.js
module.exports = {
  env: {
    browser: true,
    node: true,
  },
};

全部的环境能够在官网上查询。

指定全局变量

能够在配置文件或注释中指定额外的全局变量，false代表变量只读：

• 注释：

/* global var1, var2 */
/* global var1:false, var2:false */

• js 文件：

// .eslintrc.js
module.exports = {
  globals: {
    var1: true,
    var2: true,
  },
};

规则

在配置文件中能够设置一些规则。

这些规则的等级有三种：

• "off" 或者 0：关闭规则。
• "warn" 或者 1：打开规则，而且做为一个警告（不影响exit code）。
• "error" 或者 2：打开规则，而且做为一个错误（exit code将会是1）。

例如：

• js 文件

// .eslintrc.js
module.exports = {
  rules: {
    eqeqeq: 'off',
    curly: 'error',
  },
};

• 注释文件

/* eslint eqeqeq: "off", curly: "error" */
/* eslint eqeqeq: 0, curly: 2 */

也能够在注释中关闭全部或者某个规则：

/* eslint-disable */
/* eslint-enable */

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

具体的规则能够在官网上找到，或者使用别人写好的配置，例如eslint-config-airbnb。

使用方法

---

经过命令行工具来使用 eslint 。

eslint [options] file.js [file.js] [dir]

除了使用命令行还能够配合 webpack 或者配合编辑器的插件（如vscode-eslint）来使用