版本

ESLint 入门

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

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

前提条件

要使用 ESLint,你必须安装 Node.js (^18.18.0, ^20.9.0, 或 >=21.1.0) 并构建 SSL 支持。(如果你正在使用官方 Node.js 发行版,SSL 总是内置的。)

快速开始

你可以使用这个命令安装和配置 ESLint

npm

npm init @eslint/config@latest

yarn

yarn create @eslint/config

pnpm

pnpm create @eslint/config@latest

bun

bun create @eslint/config@latest

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

npm

# use `eslint-config-standard` shared config - npm 7+
npm init @eslint/config@latest -- --config eslint-config-standard

yarn

# use `eslint-config-standard` shared config - npm 7+
yarn create @eslint/config -- --config eslint-config-standard

pnpm

# use `eslint-config-standard` shared config - npm 7+
pnpm create @eslint/config@latest -- --config eslint-config-standard

bun

# use `eslint-config-standard` shared config - npm 7+
bun create @eslint/config@latest -- --config eslint-config-standard

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

之后,你可以像这样在任何文件或目录上运行 ESLint

npm

npx eslint yourfile.js 

yarn

yarn dlx eslint yourfile.js 

pnpm

pnpm dlx eslint yourfile.js 

bun

bunx eslint yourfile.js 

配置

注意: 如果你来自 9.0.0 之前的版本,请查看 迁移指南

当你运行 npm init @eslint/config 时,你会被问到一系列问题,以确定你如何使用 ESLint 以及应包含哪些选项。回答完这些问题后,你的目录中将创建一个 eslint.config.js (或 eslint.config.mjs) 文件。

例如,其中一个问题是“你的代码在哪里运行?” 如果你选择“浏览器”,那么你的配置文件将包含 Web 浏览器中找到的全局变量的定义。这是一个例子

import globals from "globals";
import pluginJs from "@eslint/js";


/** @type {import('eslint').Linter.Config[]} */
export default [
  {languageOptions: { globals: globals.browser }},
  pluginJs.configs.recommended,
];

pluginJs.configs.recommended 对象包含配置,以确保 规则页面 上标记为推荐的所有规则都将被启用。或者,你可以通过在 npmjs.com 上搜索“eslint-config”来使用其他人创建的配置。除非你从共享配置扩展或在你的配置中显式启用规则,否则 ESLint 不会检查你的代码。

你可以通过定义一个带有 rules 键的新对象来单独配置规则,如本例所示

import pluginJs from "@eslint/js";

export default [
    pluginJs.configs.recommended,

    {
        rules: {
            "no-unused-vars": "warn",
            "no-undef": "warn"
        }
    }
];

名称 "no-unused-vars""no-undef" 是 ESLint 中 规则 的名称。第一个值是规则的错误级别,可以是以下值之一

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

这三个错误级别允许你精细地控制 ESLint 如何应用规则(有关更多配置选项和详细信息,请参阅配置文档)。

全局安装

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

手动设置

你也可以在你的项目中手动设置 ESLint。

在开始之前,你必须已经有一个 package.json 文件。如果你没有,请务必事先运行 npm inityarn init 来创建该文件。

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

npm

npm install --save-dev eslint @eslint/js

yarn

yarn add --dev eslint @eslint/js

pnpm

pnpm add --save-dev eslint @eslint/js

bun

bun add --dev eslint @eslint/js
  1. 添加一个 eslint.config.js 文件

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

    import pluginJs from "@eslint/js";
    
    export default [
        pluginJs.configs.recommended,
    
       {
           rules: {
               "no-unused-vars": "warn",
               "no-undef": "warn"
           }
       }
    ];
    
  3. 使用 ESLint CLI 检查代码

npm

npx eslint project-dir/ file.js 

yarn

yarn dlx eslint project-dir/ file.js 

pnpm

pnpm dlx eslint project-dir/ file.js 

bun

bunx eslint project-dir/ file.js 

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


下一步

更改语言