显示javascript，CSS，HTML依赖关系的工具
我是相对较新的JavaScript，并试图find一种方法，以获得一个良好的JavaScript项目，框架等的全面了解。例如，当我在Github上查看基于JavaScript的源时，我想要一个页面之间的依赖关系快照html，css和各种.js文件需要更多的js文件（模块），而不是查看源代码树并打开单个文件。 我正在寻找的是一个对象图表工具或类似“文件图”的东西。
已经有这样一个工具了吗？ （并且，是的，我已经尝试过Google）
（我曾经使用Windows世界中的一个工具跟踪DLL，这是一个类似的概念。）
https://github.com/nodejitsu/require-analyzer让你在那里的一部分。
你也可以实现一个文件依赖分析器，如果你正在寻找更全面的HTML /模板分析这两个：
使用Firebug，你可以看到每个页面请求的文件，服务器响应，你可以按types过滤它们。 HTML视图可以让你看到整个页面，包括相关的js / css内容。 我不认为这正是你正在寻找的东西，但是我觉得这对于这种事情是有帮助的。
这里有一些小书签代码，可以帮助（取自https://www.squarefree.com/bookmarklets/webdevel.html
查看样式表：javascript：s = document.getElementsByTagName（'STYLE'）;％20ex = document.getElementsByTagName（'LINK'）;％20d = window.open（）。document;％20 / set％20base％20href / d 。开（）; d.close（）;％= 20B d.body;％20function％20trim（S）{返回％20s.replace（/ ^ \ S * \ N /，％20 ''）代替（/。 \ S * $ /，％20 ''）;％20};％20function％20iff（A，b，C）{返回％20b的A + b + C：？ '';}函数％20add（H）{b .appendChild（H）;}％20function％20makeTag（t）的{返回％20d.createElement（T）;}％20function％20makeText（标签，文本）{T = makeTag（标签）; t.appendChild（d.createTextNode（文本））;％20return％20吨;}％20add（makeText（ '风格'，％20'iframe {宽度：100％;高度：18em;边界：1px的％20solid; '））;％20add（makeText（' H3 ”，％20d.title = '风格％20sheets％20英寸％20' ％20 +％20location.href））;％20for（I = 0;％20I
查看脚本：javascript：s = document.getElementsByTagName（'SCRIPT'）;％20d = window.open（）。document;％20/ 140681 /d.open();d.close();%20b=d.body ;％20function％20trim（S）{返回％20s.replace（/ ^ \ S * \ N /，％20 ''）代替（/ \ S * $ /，％20 ''）;％20};％ 20function％20add（H）{b.appendChild（H）;}％20function％20makeTag（t）的{返回％20d.createElement（T）;}％20function％20makeText（标签，文本）{T = makeTag（标签）; t.appendChild（d.createTextNode（文本））;％20return％20吨;}％20add（makeText（ '风格'，％20'iframe {宽度：100％;高度：18em;边界：1px的％20solid;'）） ;％20add（makeText（ 'H3'，％20d.title = '脚本％20英寸％20' ％20 +％20location.href））;％20for（I = 0;％20I