eslintrc.cjs和eslint.config.mjs有什么区别-CFANZ编程社区

ESLint 的 eslintrc.cjs 和 eslint.config.mjs 是两种不同的配置文件格式，主要区别在于 配置系统版本、模块类型和 语法结构。以下是详细对比：

1. 配置系统版本

文件类型	所属系统	说明
`.eslintrc.cjs`	旧版配置	ESLint 传统配置方式（基于 `eslintrc`）
`eslint.config.mjs`	新版扁平化配置	ESLint v8.23.0+ 引入的扁平化配置系统

旧版配置（.eslintrc.cjs）：
- 支持多种格式：.js、.cjs、.json、.yaml 等。
- 配置通过 module.exports 导出对象。
- 优先级由文件层级决定（如 src/.eslintrc 会覆盖根目录配置）。
新版配置（eslint.config.mjs）：
- 仅支持 ESM 模块（必须使用 .mjs 或 type: "module" 的 .js）。
- 配置通过 export default 导出一个数组，允许多个配置叠加。
- 扁平化设计，无层级优先级，更易维护。

2. 模块类型

文件类型	模块系统	适用场景
`.eslintrc.cjs`	CommonJS	旧项目或 `package.json` 中 `"type": "commonjs"`
`eslint.config.mjs`	ES Module (ESM)	新项目或 `package.json` 中 `"type": "module"`

.cjs：显式声明为 CommonJS 模块，适用于 Node.js 默认模块系统。
.mjs：显式声明为 ESM 模块，适合现代浏览器或 ESM 项目。

3. 语法差异

旧版配置（`.eslintrc.cjs`）

module.exports = {
  env: { node: true },
  rules: {
    "no-console": "error"
  }
};

新版配置（`eslint.config.mjs`）

export default [
  {
    files: ["**/*.js"],
    languageOptions: {
      ecmaVersion: "latest"
    },
    rules: {
      "no-console": "error"
    }
  }
];

新版配置是数组形式，支持多配置合并。
规则、插件等通过扁平化方式定义，更清晰。

4. 优先级

如果同时存在 eslint.config.mjs 和 .eslintrc.cjs，**ESLint 会优先使用 eslint.config.mjs**。
旧版配置系统会被忽略。

5. 迁移建议

场景	选择文件	操作步骤
新项目	`eslint.config.mjs`	直接使用新版扁平化配置。
旧项目升级	逐步迁移到 `eslint.config.mjs`	运行 `npx eslint --init` 生成新配置。
CommonJS 项目	`.eslintrc.cjs`	保持旧配置，避免模块冲突。

总结表

特性	`.eslintrc.cjs`	`eslint.config.mjs`
配置系统	旧版层级配置	新版扁平化配置
模块类型	CommonJS	ES Module (ESM)
语法	导出对象	导出数组
文件扩展名	`.cjs`	`.mjs`（或 ESM `.js`）
适用场景	旧项目、CommonJS 环境	新项目、ESM 环境