ESLint 入门
ESLint 入门
目录
前提条件
快速开始
配置
全局安装
手动设置
下一步
ESLint 是一个用于识别和报告在 ECMAScript/JavaScript 代码中发现的模式的工具，目标是使代码更一致并避免错误。
ESLint 是完全可插拔的。每个规则都是一个插件，你可以在运行时添加更多。你还可以添加社区插件、配置和解析器来扩展 ESLint 的功能。
前提条件
要使用 ESLint，你必须安装 Node.js (^18.18.0, ^20.9.0, 或 >=21.1.0) 并构建 SSL 支持。（如果你正在使用官方 Node.js 发行版，SSL 总是内置的。）
快速开始
你可以使用这个命令安装和配置 ESLint
npm
yarn
pnpm
bun
npm
npm init @eslint/config@latest
1
yarn
yarn create @eslint/config
1
pnpm
pnpm create @eslint/config@latest
1
bun
bun create @eslint/config@latest
1
如果你想使用托管在 npm 上的特定可共享配置，你可以使用 --config 选项并指定包名
npm
yarn
pnpm
bun
npm
# use `eslint-config-standard` shared config - npm 7+
npm init @eslint/config@latest -- --config eslint-config-standard
12
yarn
# use `eslint-config-standard` shared config - npm 7+
yarn create @eslint/config -- --config eslint-config-standard
12
pnpm
# use `eslint-config-standard` shared config - npm 7+
pnpm create @eslint/config@latest -- --config eslint-config-standard
12
bun
# use `eslint-config-standard` shared config - npm 7+
bun create @eslint/config@latest -- --config eslint-config-standard
12
注意： npm init @eslint/config 假设你已经有一个 package.json 文件。如果你没有，请务必事先运行 npm init 或 yarn init。
之后，你可以像这样在任何文件或目录上运行 ESLint
npm
yarn
pnpm
bun
npm
npx eslint yourfile.js
1
yarn
yarn dlx eslint yourfile.js
1
pnpm
pnpm dlx eslint yourfile.js
1
bun
bunx eslint yourfile.js
1
配置
注意： 如果你来自 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,
];
123456789pluginJs.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"
}
}
];
123456789101112名称 "no-unused-vars" 和 "no-undef" 是 ESLint 中 规则 的名称。第一个值是规则的错误级别，可以是以下值之一
“off” 或 0 - 关闭规则
“warn” 或 1 - 将规则作为警告打开（不影响退出代码）
“error” 或 2 - 将规则作为错误打开（退出代码将为 1）
这三个错误级别允许你精细地控制 ESLint 如何应用规则（有关更多配置选项和详细信息，请参阅配置文档）。
全局安装
也可以使用 npm install eslint --global 全局安装 ESLint，而不是本地安装。但是，不建议这样做，如果你全局安装 ESLint，你使用的任何插件或可共享配置仍然必须本地安装。
手动设置
你也可以在你的项目中手动设置 ESLint。
重要
如果你正在使用 pnpm，请务必创建一个 .npmrc 文件，其中至少包含以下设置
auto-install-peers=true
node-linker=hoisted
12这确保了 pnpm 以一种更兼容 npm 的方式安装依赖项，并且不太可能产生错误。
在开始之前，你必须已经有一个 package.json 文件。如果你没有，请务必事先运行 npm init 或 yarn init 来创建该文件。
在你的项目中安装 ESLint 包
npm
yarn
pnpm
bun
npm
npm install --save-dev eslint @eslint/js
1
yarn
yarn add --dev eslint @eslint/js
1
pnpm
pnpm add --save-dev eslint @eslint/js
1
bun
bun add --dev eslint @eslint/js
1
添加一个 eslint.config.js 文件
# Create JavaScript configuration file
touch eslint.config.js
12
将配置添加到 eslint.config.js 文件。请参阅 配置 ESLint 文档 以了解如何添加规则、自定义配置、插件等。
import pluginJs from "@eslint/js";
export default [
pluginJs.configs.recommended,
{
rules: {
"no-unused-vars": "warn",
"no-undef": "warn"
}
}
];
123456789101112
使用 ESLint CLI 检查代码
npm
yarn
pnpm
bun
npm
npx eslint project-dir/ file.js
1
yarn
yarn dlx eslint project-dir/ file.js
1
pnpm
pnpm dlx eslint project-dir/ file.js
1
bun
bunx eslint project-dir/ file.js
1
有关可用 CLI 选项的更多信息，请参阅 命令行界面。
下一步
了解 ESLint 的 高级配置。
熟悉 命令行选项。
探索 ESLint 与其他工具的集成，如编辑器、构建系统等。
找不到合适的规则？创建你自己的 自定义规则。
通过 贡献 使 ESLint 变得更好。