ESLintrc生成器

生成的配置包含什么

生成器始终以eslint:recommended为基础，并只添加与您的选择对应的内容：

• 包含browser和/或node的env，以及es2022
• 启用 TypeScript 时，添加@typescript-eslint/parser和plugin:@typescript-eslint/recommended
• 启用 React 时，添加plugin:react/recommended
• 将no-console和no-unused-vars设置为warn

输出是采用传统.eslintrc.json形式的简单 JSON 对象，可直接粘贴，并可根据自己的规则进行扩展。

平面配置与传统配置对比

ESLint 9 已弃用 .eslintrc.* 格式，转而采用扁平配置格式（eslint.config.js）。主要差异如下：

新项目应采用扁平化配置；现有项目可在10.x系列版本中继续沿用旧配置，但建议进行迁移。

插件生态系统

典型的 React/TS 项目插件：

@typescript-eslint/eslint-plugin
@typescript-eslint/parser
eslint-plugin-react
eslint-plugin-react-hooks
eslint-plugin-jsx-a11y
eslint-plugin-import
eslint-config-prettier

这相当于为一个具有中等个性化设置的系统配置提供了六个安装包。生成器只会添加您选择的插件，因此您只需安装配置所引用的内容。

与 Prettier 共存

Prettier 负责格式设置；ESLint 则负责除格式外的语法正确性与风格规范。为避免冲突：

1. 安装 eslint-config-prettier，并将其作为扩展配置文件中的最后一个项目添加。
2. 该功能会关闭所有与 Prettier 输出结果存在冲突的 ESLint 规则。
3. 单独运行 Prettier（在编辑器保存时、提交前钩子阶段以及持续集成过程中）。

请勿在新项目中使用 eslint-plugin-prettier；该工具会在 ESLint 中运行 Prettier，从而拖慢 ESLint 的运行速度。建议将这两个工具分开使用。

规则调优技巧

• 初始状态宽松，逐步收紧约束。 在出现错误前启用警告功能。
• 为测试进行覆盖。 测试文件通常需要启用 no-unused-expressions 的宽松配置以及 Jest 全局变量支持。
• 为脚本进行覆盖。 构建脚本可能需要使用 Node 全局变量，但无需全局添加 env: node。
• 为覆盖添加说明。 每条规则的修改均需附注说明理由。

与您的编辑器匹配的配置

VS Code 需要安装并配置 ESLint 扩展。请将这些设置添加到工作区配置中，以便在保存时自动修复错误。

{
  "editor.codeActionsOnSave": { "source.fixAll.eslint": "explicit" },
  "eslint.validate": ["javascript", "typescript", "javascriptreact", "typescriptreact"]
}