node package manager
Easy collaboration. Discover, share, and reuse code in your team. Create a free org »

jsviz

jsviz

For visualizing the internal and external dependencies of a JavaScript codebase. Takes a directory to analyze and outputs a graph representation in HTML.

Uses esprima and estraverse to walk the syntax tree, pick out any require() calls, and generate a dependency graph. Generates an HTML file and uses d3 to visualize the graph. Example output (of this project):

jsviz of jsviz

Usage

From the command line, pass in a directory (that you want analyed) and an output file:

npm i -g jsviz
 
jsviz ~/taco-project > taco-project-viz.html

From JavaScript:

npm i jsviz
var jsviz = require('jsviz');
 
// Grab the dependency graph 
jsviz.graph('~/taco-project', function (err, graph) {
 
});
 
// Turn the graph into html 
jsviz.html(graph, function (err, html) {
 
});