ESLint 配置生成器
指导
ESLint 配置生成器
在几秒钟内为您的项目生成一个可直接使用的 ESLint 配置。选择您的框架、语言版本、环境和规则严重性,然后将输出直接复制到您的仓库中。支持现代扁平化配置(ESLint v9+)和 ESLint v8 使用的旧版配置。eslint.config.js,ESLint v9+ .eslintrc.json ESLint v8 使用的格式。
如何使用
- 选择您的配置格式:扁平化(ESLint v9+)或旧版(.eslintrc.json)。
- 选择您正在使用的框架 — 原生 JS、Node.js、React、Next.js、Vue 3 或 TypeScript。
- 可选地选择一个编码规范(Airbnb、Standard、Google、Prettier)以进行扩展。
- 如果您的技术栈混合了 JS 和 TS,请开启 TypeScript 支持。
- 调整语言选项、环境和规则严重性以匹配您的代码库。
- 复制生成的配置并粘贴到
eslint.config.js或.eslintrc.json,然后安装打印出的依赖项。
特征
- 扁平化与旧版格式 – 生成适用于 ESLint v9+ 的
eslint.config.js或适用于 v8 的.eslintrc.json。 - 框架预设 – 原生 JS、Node.js、React、Next.js、Vue 3 和 TypeScript,已正确配置插件和推荐配置。
- 编码规范 – 可选的 Airbnb、Standard(通过 neostandard 实现的扁平化)、Google 和 Prettier 集成。
- 通用规则开关 – 为
semi,quotes,indent,no-unused-vars,no-console,eqeqeq,prefer-const,并且no-var. - 安装命令 – 打印匹配的
npm install -D行,以便您确切知道需要添加哪些包。 - 内联注释 – 可选地在每个选项旁边添加解释性注释,使配置本身也充当文档。
- 仅客户端 – 所有操作都在您的浏览器中运行;不会上传任何代码。
常问问题
-
扁平化配置和旧版 .eslintrc 有什么区别?
扁平化配置是一个单一的 JavaScript 模块,导出一个数组(或 helpers 如 tseslint.config() 的结果)。它在 ESLint v9 中取代了旧版 .eslintrc 的层级结构,并使用真实导入而非字符串查找,这使得配置更易于理解和与原生 ES 模块协同工作。旧版 .eslintrc 系统在 ESLint v8 中仍然有效,但在新版本中已不再为默认选项。
-
为什么 Prettier 必须最后应用?
eslint-config-prettier 会关闭与 Prettier 格式器冲突的 ESLint 规则,因此将它放在最后可以确保这些格式规则被禁用,无论前面的配置是否启用了它们。如果将 Prettier 放在前面,后续配置可能会重新启用与 Prettier 冲突的规则,从而导致格式良好的代码出现噪音的 lint 错误。
-
env / globals 选项实际上做了什么?
它告诉解析器哪些预定义的全局变量存在,以避免规则(如 no-undef)对这些变量提出抱怨。浏览器环境会添加 window、document、fetch 等;Node.js 环境会添加 process、require、__dirname。如果没有正确声明全局变量,合法的代码可能会被标记为引用了未定义的变量。
-
error、warn 和 off 严重性之间的区别是什么?
将规则设置为 error 会使 ESLint 退出并返回非零状态,从而导致 CI 和预提交钩子失败。将规则设置为 warn 会显示消息但不会导致构建失败。设置为 off 会完全禁用该规则。大多数团队将 error 保留用于代码正确性规则,而将 warn 用于尚未准备强制执行的风格或迁移噪音。
