ESLint 配置文件中使用 TypeScript 的注意事项

在最新版本的 ESLint 中，开发者可以通过 eslint.config.ts 文件来编写 TypeScript 格式的配置。然而，在实际使用过程中，可能会遇到一些兼容性问题，特别是在工具链的选择上需要特别注意。

问题现象

当开发者尝试使用 TypeScript 编写的 ESLint 配置文件（eslint.config.ts）时，可能会遇到以下错误：

TypeError: Cannot read properties of undefined (reading 'rules')

这个错误通常发生在调用 ESLint.calculateConfigForFile() 方法时，表面上看似乎是插件规则处理出现了问题。

根本原因

经过深入分析，这个问题实际上与 TypeScript 运行时环境的选择有关。ESLint 内部使用 jiti 作为其配置文件加载器，而开发者可能同时使用了 tsx 这样的 TypeScript 运行时工具。

当 jiti 和 tsx 同时作用于同一个 TypeScript 文件时，它们之间的交互可能会导致一些意外的行为，特别是:

1. 模块加载方式的冲突
2. 转译流程的重叠
3. 缓存机制的不兼容

解决方案

针对这个问题，有以下几种解决方案：

1. 统一使用 jiti：既然 ESLint 内部已经使用 jiti 作为加载器，建议开发者也在项目中使用 jiti 作为 TypeScript 运行时，保持工具链的一致性。

2. 使用 JavaScript 配置文件：如果不需要 TypeScript 的特定功能，可以继续使用传统的 eslint.config.js 文件。

3. 分离运行环境：将配置文件的加载与业务代码的执行环境分离，确保它们使用相同的工具链。

最佳实践

对于希望在 ESLint 配置中使用 TypeScript 的开发者，建议遵循以下实践：

1. 确保项目中的工具链一致，避免混合使用不同的 TypeScript 运行时
2. 在 package.json 中明确指定使用的工具版本
3. 对于复杂的配置，考虑将部分逻辑提取到独立的模块中
4. 定期更新 ESLint 和相关插件到最新版本，以获取最好的 TypeScript 支持

总结

ESLint 对 TypeScript 配置文件的支持是一个不断演进的功能。开发者在享受 TypeScript 带来的类型安全和现代语法优势的同时，也需要注意工具链的选择和兼容性问题。通过理解底层机制和遵循最佳实践，可以避免大多数配置加载问题，确保 ESLint 在 TypeScript 项目中稳定运行。

对于刚接触 ESLint 配置 TypeScript 支持的开发者，建议从小规模配置开始，逐步验证工具链的兼容性，再扩展到更复杂的配置场景。