ESLint 入门

ESLint 是一种用于识别和报告在 ECMAScript/JavaScript 代码中发现的模式的工具,其目标是使代码更加一致并避免错误。

ESLint 是完全可插拔的。 每条规则都是一个插件,您可以在运行时添加更多。 您还可以添加社区插件、配置和解析器来扩展 ESLint 的功能。

先决条件

要使用 ESLint,您必须安装并构建 Node.js^12.22.0^14.17.0>=16.0.0)并支持 SSL。 (如果您使用的是官方 Node.js 发行版,则始终内置 SSL。)

快速开始

您可以使用以下命令安装和配置 ESLint:

npm init @eslint/config

如果您想使用托管在 npm 上的特定可共享配置,您可以使用 --config 选项并指定包名称:

<a id="use-eslint-config-semistandard-shared-config"></a>

# 使用 `eslint-config-semistandard` 共享配置

# npm 7+
npm init @eslint/config -- --config semistandard

<a id="or-eslint-config-prefix-is-optional"></a>

# 或(`eslint-config` 前缀是可选的)
npm init @eslint/config -- --config eslint-config-semistandard

<a id="-npm-6x-no-extra-double-dash"></a>

# ⚠️ npm 6.x 没有额外的双破折号:
npm init @eslint/config --config semistandard

--config 标志还支持传入数组:

npm init @eslint/config -- --config semistandard,standard
<a id="or"></a>

# 或
npm init @eslint/config -- --config semistandard --config standard

注意: npm init @eslint/config 假设您已经有一个 package.json 文件。 如果没有,请确保事先运行 npm inityarn init

之后,您可以在任何文件或目录上运行 ESLint,如下所示:

npx eslint yourfile.js

<a id="or-1"></a>

# 或

yarn run eslint yourfile.js

配置

**注意:**如果您来自 1.0.0 之前的版本,请参阅 迁移指南

运行 npm init @eslint/config 后,您的目录中将有一个 .eslintrc.{js,yml,json} 文件。 在其中,您将看到一些配置如下的规则:

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

名称 "semi""quotes" 是 ESLint 中 规则 的名称。 第一个值是规则的错误级别,可以是以下值之一:

  • "off" or 0 - 关闭规则
  • "warn" or 1 - 将规则作为警告打开(不影响退出代码)
  • "error" or 2 - 将规则作为错误打开(退出代码将为 1)

三个错误级别允许您对 ESLint 如何应用规则进行细粒度控制(有关更多配置选项和详细信息,请参阅 配置文档)。

您的 .eslintrc.{js,yml,json} 配置文件还将包括以下行:

{
    "extends": "eslint:recommended"
}

因为这行,规则页 上所有标记为 “(recommended)” 的规则都会被开启。 或者,您可以通过在 npmjs.com 上搜索 “eslint-config” 来使用其他人创建的配置。 除非您从共享配置扩展或在配置中明确打开规则,否则 ESLint 不会检查您的代码。

全局安装

也可以使用 npm install eslint --global 在全局而不是本地安装 ESLint。 但是,不推荐这样做,如果您全局安装 ESLint,您使用的任何插件或可共享配置仍必须安装在本地。

手动设置

您还可以在项目中手动设置 ESLint。

在开始之前,您必须已经有一个 package.json 文件。 如果不这样做,请确保事先运行 npm inityarn init 来创建文件。

  1. 在你的项目中安装 ESLint 包:

    npm install --save-dev eslint
    
  2. 在其中一个 支持的配置文件格式 中添加一个 .eslintrc 文件。

    # Create JavaScript configuration file
    touch .eslintrc.js
    
  3. 将配置添加到 .eslintrc 文件。 请参阅 配置 ESLint 文档 了解如何添加规则、环境、自定义配置、插件等。

    // .eslintrc.js example
    module.exports = {
      "env": {
          "browser": true,
          "es2021": true
      },
      "extends": "eslint:recommended",
      "parserOptions": {
          "ecmaVersion": "latest",
          "sourceType": "module"
      },
    }
    
  4. 使用 ESLint CLI 的 Lint 代码:

    npx eslint project-dir/ file1.js
    

    有关可用 CLI 选项的更多信息,请参阅 命令行接口


下一步

ESLint 中文网
粤ICP备13048890号