dependency-cruiser 是最可靠的 cli 依赖分析工具，需配合 graphviz 的 dot 渲染图表，配置 .dependency-cruiser.js 并排除 node_modules 等无关路径才能生成有效业务依赖图。
dependency-cruiser 是当前最可靠的 CLI 工具
VSCode 本身不生成依赖图，必须靠 dependency-cruiser 这类外部 CLI 工具先产出结构化数据，再交由 dot 渲染。它不是 VSCode 插件，而是命令行工具，需手动集成进终端或 tasks。
安装后第一件事是运行：npx dependency-cruiser --init，生成 .dependency-cruiser.js。跳过这步等于裸跑——尤其 doNotFollow 和 exclude 字段不配，遇到 node_modules 里的循环引用，depcruise 会卡死或直接报 error: cycle detected。
Vue/TSX 项目务必加参数：--extensions js,ts,jsx,tsx,vue，否则 <script setup></script> 中的 import 全被忽略；ESM 项目默认不扫 node_modules，这是优点，但若要排除特定内部包（如 @myorg/utils），得在配置里显式写 exclude: ["^@myorg/utils"]。
Graphviz 是渲染环节不可跳过的依赖
没装 dot 命令，npx depcruise --output-type dot 的输出就无法转成图，直接报 command not found: dot。
- macOS：用
brew install graphviz - Windows：去 Graphviz 官网下载安装包，并确保
dot.exe在PATH中
典型管道命令：npx depcruise --silent src/ --output-type dot | dot -Tsvg > deps.svg。其中 --silent 很关键——不加的话，depcruise 的警告日志会混进 dot 数据，导致 dot 报 syntax error in line X。
SVG 打开是空白？可能是图太大浏览器撑不住，改用 dot -Tpng，或加 --max-depth 2 控制层级。
VSCode 插件只是快捷入口，不是全自动方案
像 Project Dependencies Viewer（ID: grunow.project-dependencies-viewer）这类插件，右键文件 → “Show Dependencies” 就能触发扫描，但它只做单向静态分析：
- 只展示“当前文件
import了谁”，不显示“谁import了当前文件” - 对
import()动态路径、require('' + name)、eval加载的模块完全不可见 - 不读
.dependency-cruiser.js配置，所有过滤逻辑失效，node_modules全塞进图里，核心模块反而难定位 - 首次加载慢，大项目可能卡顿十几秒；节点能点击跳转，但无缩放、拖拽、悬停提示路径等交互功能
madge 生成的 HTML 图更实用
如果只是想快速看循环依赖和整体流向，madge 生成的 HTML 图比 SVG 更省事：npx madge --html deps.html --layout dot src/。
打开 deps.html 就能缩放、拖拽、悬停看路径，循环节点自动高亮，比在 SVG 里肉眼找箭头靠谱得多。
注意：madge 默认只识别 CommonJS 的 require，若项目全用 ESM，得加 --extensions js,ts,jsx,tsx 显式声明后缀，否则大量模块会被忽略；它默认不扫 node_modules，天然避开噪音，但若要排除特定内部包，得用 --exclude 正则。
真正麻烦的不是生成图，而是图里一堆 node_modules 内部依赖把关键业务链路淹没了。每次生成前，务必用配置文件过滤掉第三方包——这个动作容易被跳过，但跳过之后，图就失去了分析价值。
