VSCode-ESLint 中工作目录的相对路径配置技巧

在 Angular 库的 monorepo 项目中，开发者经常遇到需要为 ESLint 配置工作目录的情况。特别是当项目结构使用非标准命名（如 tsconfig.lib.json 而非 tsconfig.json）时，如何优雅地配置工作目录路径就显得尤为重要。

工作目录配置的核心问题

许多开发者习惯使用绝对路径或 VS Code 变量（如 ${workspaceFolder}）来指定 ESLint 的工作目录。然而，这种做法存在两个主要问题：

1. 协作困难：绝对路径在不同开发者的机器上可能不一致，导致配置无法共享
2. 维护成本高：当项目结构调整时，需要手动更新多个路径配置

最佳实践解决方案

VSCode-ESLint 插件支持使用相对路径来指定工作目录，这是最推荐的配置方式。例如：

{
  "eslint.workingDirectories": [
    { "mode": "auto" },
    "./angular-libraries"
  ]
}

这种配置方式有以下优势：

1. 跨环境兼容：相对路径基于工作区根目录，在任何开发者的机器上都能正确解析
2. 易于维护：项目结构调整时，只需修改一处配置
3. 清晰直观：路径关系一目了然，便于团队理解

深入理解工作目录配置

在复杂的 monorepo 结构中，合理配置工作目录尤为重要：

1. auto 模式：自动检测项目中的 TypeScript 配置文件，适用于标准命名（tsconfig.json）
2. 显式路径：对于非标准命名的配置文件，需要显式指定路径
3. 多项目支持：可以同时配置多个工作目录，支持复杂的项目结构

实际应用建议

对于 Angular 库项目，建议采用以下配置策略：

1. 优先使用相对路径
2. 对标准项目使用 auto 模式
3. 对特殊命名的配置文件使用显式相对路径
4. 定期检查配置是否仍然符合项目结构

通过这种方式，可以确保 ESLint 在所有开发环境中都能正确工作，同时保持配置的简洁性和可维护性。