如何生成函数调用图

时间:2019-06-13 15:26:50

标签: typescript webpack

我试图可视化我们代码库中的哪个模块正在调用哪些函数。我们正在使用webpack进行构建,并使用打字稿进行编译。我会认为,由于我们使用的是打字稿,因此工具链中的某些信息可以知道从哪个模块调用了哪个函数(或更确切地说,导出)。

我尝试使用webpack-bundle-analyzer插件来可视化正在使用的模块。有很多工具可以做类似的事情,它们都基于webpack的--stat功能而构建。但是我没有看到函数调用,只是看到了哪些模块。

只要模块导出单个函数,该 实际上就非常有用。但这并非总是如此,对于第三方模块,我们无法对此进行控制。它只会显示一些模块的内容,就是这样。

对于上述情况,这就是我所做的:

webpack ./src/js/main.ts --profile --json > stats.json
webpack-bundle-analyzer stats.json -m static

这将生成报告。我无法弄清楚如何添加更多细节(即函数调用/特定导出的用法)。

我想我可能需要一种完全不同的方法。我可能需要一个用于Typescript而非Webpack的插件,因为typescript是链中的链接,它可能知道哪些模块正在使用哪些导出。

webpack-bundle-analyzer生成的图形非常完美,只要它可以放大模块输出而不是停在整个模块上即可。

0 个答案:

没有答案