ESLint 配置文件中的 files 属性使用误区解析

在 JavaScript 和 TypeScript 项目中使用 ESLint 进行代码规范检查时，很多开发者会遇到一个常见的配置误区：误以为在 eslint.config.js 文件中使用 files 属性可以限制 ESLint 的检查范围。本文将深入分析这个问题的本质，并给出正确的解决方案。

问题现象

当开发者在 ESLint 配置中设置了 files 属性，例如：

{
  files: ['src/**/*.{ts,tsx}'],
  // 其他配置...
}

他们期望 ESLint 只会检查 src 目录下的 TypeScript 文件。然而实际上，ESLint 仍然会检查项目中的其他文件类型和目录，这显然与预期不符。

原因分析

这种误解源于对 ESLint 工作机制的不完全理解。在 ESLint 中，files 属性的作用并不是用来排除文件，而是用来指定该配置块适用的文件范围。换句话说：

1. files 属性定义的是"这些配置将应用于哪些文件"，而不是"只检查这些文件"
2. ESLint 默认会检查项目中的所有 JavaScript 文件（.js, .mjs, .cjs）
3. 即使某个文件不匹配任何配置中的 files 模式，只要它符合 ESLint 的默认检查规则，仍然会被检查

正确解决方案

要实现真正限制 ESLint 检查范围的目的，应该使用以下方法：

方法一：使用全局忽略配置

在项目根目录创建 .eslintignore 文件，内容示例：

*
!src/**/*.ts
!src/**/*.tsx

这种模式表示：

• 第一行的 * 表示忽略所有文件
• 后面的 ! 开头的行表示不忽略特定模式的文件

方法二：通过命令行参数限制

运行 ESLint 时直接指定检查范围：

eslint src/**/*.{ts,tsx}

方法三：调整默认检查规则

在 eslint.config.js 中修改默认的检查规则：

export default {
  // 覆盖默认规则，只检查 TypeScript 文件
  ignores: ["**/*", "!**/*.ts", "!**/*.tsx"],
  // 其他配置...
}

最佳实践建议

1. 对于大型项目，建议结合使用 .eslintignore 和 files 属性
2. 明确区分"配置适用范围"和"检查范围"两个概念
3. 在团队协作项目中，将忽略规则显式化，避免因个人环境差异导致问题
4. 定期检查 ESLint 的检查范围，确保没有意外检查不需要的文件

理解这些细微差别可以帮助开发者更高效地使用 ESLint，避免在项目配置上浪费不必要的时间。