模块依赖关系图
使用 IntelliJ IDEA,您可以在 JavaScript 和 TypeScript 项目中获取上下文内导入和导出的可视化。
构建模块依赖关系图
从 JavaScript、TypeScript 或 HTML 文件的上下文菜单或文件夹的上下文菜单中选择 。
该操作不适用于 node_modules 和
Excluded文件夹。如果在可以构建多种类型图表的文件夹上调用此操作,请从 列表中选择 选择图表类型。
IntelliJ IDEA 递归分析所选文件或所选文件夹中的所有文件中的 import 和 require 语句以及 script 标签,并在单独的选项卡中显示一个图表,展示这些文件之间的相互依赖关系:

一个图表由多个矩形组成。 每个都会显示 分析选择的文件名称以及检测到的导入列表。 如果一个导入被解析,将会在其旁边显示一个指示导入符号类型(例如
或 )的图标。
从 已分析文件指向 目标文件的箭头指示已检测到的导入内容。 如果 目标文件是一个库,则其名称会显示在灰色背景上。 如果从库中导入未解析,则 目标文件显示为带有红色边框的灰色矩形。
解决的 导入和 导出分别用
或 图标标记。
分析图表

在图表或节点的上下文菜单中选择 ,然后选择所需操作。
显示图表特征
要获取图表的一般信息和统计数据,请在图表的上下文菜单中选择 。
如需了解详情关于某项指标,请点击其旁边的
。

聚焦于选中节点
要更深入地检查多个节点,请先选择它们,再从上下文菜单中选择 。

除当前选中节点外,所有节点都被隐藏。

要恢复图表,请按 Ctrl+Z。
聚焦于节点邻域
要更深入地检查某个节点,请选择所需节点,然后从其上下文菜单中选择 。
在打开的 聚焦于节点邻近区域 对话框中,指定要显示的依赖项,然后点击 查找。

显示包含依赖项的选中节点。

聚焦于两个节点之间的路径
选择要检查其间路径的节点,然后从上下文菜单中选择 。

在 聚焦于两个节点之间的路径 对话框中,配置搜索内容并点击 查找。

聚焦于循环
如需仅视图 循环依赖 ,请在图表的上下文菜单中选择 。
在打开的 将视图聚焦于循环 对话框中,指定要显示的循环类型及分析作用域。

图表显示了指定作用域中彼此之间存在循环导入的模块。

测量图中心性
使用此操作可识别图表中重要的节点。
在图表的上下文菜单中选择 。
在打开的 度量中心性 对话框中,指定需要考虑的关键形参,然后点击 测量。

IntelliJ IDEA 根据节点的计算重要性高亮显示节点,最重要的节点被明亮地选中。 节点的重要性以 0.0 到 1.0 的小数值表示,显示在每个节点旁边。

将节点分组为集群
您可以根据节点边的相似性,使用现代方法自动将图中的节点分组为集群,并确定集群的最佳数量。
在图表的上下文菜单中选择 。
在打开的 自动集中 对话框中,选择作为集群依据的形参,然后点击 运行。

IntelliJ IDEA 显示生成的集群。

从图表导航至源代码
上下文菜单
选定元素操作
仅当在图表中选中了节点时,才会显示此菜单项及其下的项。
内容
条目 | 描述 |
|---|---|
新建 | 仅在图表中选中节点时,此项才可用。 使用此项可向当前图表添加以下类型的备注。
|
更改可见性级别 | 选择详细级别,可用选项如下:
了解详情请访问 yFiles 官方网站。 |
跳转到
仅在图表中选中节点时,此项才可用。 使用此项可打开弹出列表,显示选中项所包含的文件导入列表。 在弹出窗口中点击文件以在编辑器中打开。

删除
仅在图表中至少选中一个节点时,此操作才可用。 使用操作可将所选节点从图表中移除。
分析图表
选择此项以访问用于检查图表的操作 如上所述。
重构
仅在选中节点时此菜单项可用。 使用此菜单项可打开弹出列表,展示当前上下文中可用的重构操作:
布局
选择此菜单项可打开图表可用布局的弹出列表。 了解详情请访问 yFiles 官方网站。
方向
选择此项可打开弹出列表,在屏幕上选择图表视觉排列方式。
应用当前布局
选择此菜单项可应用从图表上下文菜单 布局 列表中当前选中的布局。 此操作也可在工具栏中使用。
连线路由自动化
将图表内容缩放至图表窗口边缘。 此操作也可在工具栏中使用。
外观
使用此菜单项可配置边和标签的显示效果、指定是否显示网格等。 了解详情请访问 yFiles 官方网站。
行为
使用此菜单项可打开弹出列表,以启用或禁用以下选项:
将图表复制到剪贴板
此操作也可在工具栏中使用。
将所选内容复制到剪贴板
选中此菜单项并选择任意图表区域——所选区域将被复制到剪贴板。 此操作也可在工具栏中使用。
导出图表
可使用与第三方工具兼容的多种格式将图表导出为文件、图像,或在浏览器中打开图表。

您可以选择并配置以下选项:
:点击此按钮以选择要将图表导出到的第三方编辑器。
:点击此按钮以使用可用格式之一将图表保存到剪贴板。
:点击此按钮以将当前图表保存为文件。 您可以使用列表中的可用格式之一。
:点击此按钮以将当前图表保存为 PNG 格式。
:点击此按钮以打印图表。
此操作也可在工具栏中使用。
工具栏
条目 | 描述 |
|---|---|
点击此图标以选择详细级别,可用选项如下:
了解详情请访问 yFiles 官方网站。 | |
| 放大图表 / 缩小图表 |
点击此图标可恢复图表的原始大小,即放大或缩小前的状态。 | |
点击此图标以使内容适应当前图表大小。 | |
点击此图标以应用从图表上下文菜单 布局 列表中当前选中的布局。 | |
点击此图标将图表内容缩放至图表窗口边缘。 | |
点击此图标将图表复制到剪贴板。 | |
点击此图标,然后选择任意图表区域——所选区域将被复制到剪贴板。 | |
点击此图标可使用与第三方工具兼容的多种格式将图表导出为文件或图像,或在浏览器中打开图表。 ![]() 您可以选择并配置以下选项:
| |
点击此按钮以刷新整个图表。 | |
点击此按钮以打开 图表设置 ,您可以在其中配置其他选项。 |



