如何在NX、React中查找并解决循环依赖（Circular Dependencies）

下面是几个适配NX+React环境的循环依赖检查方案，替代不好用的madge：

1. 用NX原生工具（最推荐） #

NX本身就提供了完整的依赖管控能力，不需要额外装第三方包：

• 依赖图谱可视化：运行 nx dep-graph，命令执行后会自动打开浏览器页面，展示整个monorepo的依赖关系图谱，循环依赖会以高亮或特殊标记显示，一眼就能定位。如果只想看最近变更过的项目依赖，用 nx affected:dep-graph 更高效。
• ESLint规则强制检查：NX内置的 @nx/enforce-module-boundaries ESLint规则，不仅能拦截循环依赖，还能管控项目间的依赖权限（比如限制apps不能直接依赖其他apps，只能依赖libs）。确保项目的ESLint配置里启用了这个规则，然后运行 nx lint <项目名> 或者 nx lint --all，就能批量检测出所有循环依赖问题，还会给出具体的依赖路径。

2. 用NX专属依赖检查工具 #

nx-dependency-checker 是专门为NX monorepo打造的依赖扫描工具，能精准识别循环依赖：

• 安装：npm install nx-dependency-checker --save-dev
• 运行扫描：npx nx-dependency-checker
• 工具会输出清晰的循环依赖链，直接告诉你哪几个项目/模块之间形成了循环，方便快速修复。

3. 调整Madge配置适配NX #

如果一定要用Madge，需要配置它解析NX的TypeScript路径别名：

• 在项目根目录创建 madge.config.js：

module.exports = {
  baseDir: './',
  includeNpm: false,
  tsConfig: './tsconfig.base.json' // 指向NX的基础TS配置文件
};

• 运行检测命令：madge --circular --extensions ts,tsx ./apps ./libs
  这样Madge就能正确识别NX项目里的路径别名，正常扫描循环依赖了。

内容的提问来源于stack exchange，提问作者Ali Bahaari