Create developer friendly API

[BrunnerLivio]

trafficstars

Hello everyone, Firstly; Thanks for sharing this awesome project!

I want to generate this graph automatically inside a Pipeline, so I can automatically use the graph as build artifact on every release. This. would require an easy developer interface as npm package and / or as CLI tool.

As CLI I could imagine something like that:

npm-dependency-graph “@angular/core,@angular/common” —filter “@angular” > graph.svg

or as package

import * as NpmDependenyGraph from “npm-dependency-graph”;

// Returns buffer
NpmDependenyGraph.generate({
  packages: [‘@angular/core, ‘@angular/common’],
  filter: [“@angular”]
})

Are there any plans for this, or have I missed something in the documenation?

Cheers, Livio

Edit: sorry for the bad formatting. Currently on mobile😅

[JanKoehnlein]

There are no such plans currently, but contributions are always welcome!

The tricky part would be to mimic the browser's rendering. As in SVG, you cannot make boxes as large as their contents, we need to grab the bounds of elements first before doing the layout. As this is also affected by CSS (e.g. font sizes), we do a hidden rendering cycle in the browser to grab these bounds.

[BrunnerLivio]

Hmm I see. Is this hard to implement or maybe it would be easier to just use chrome headless? I'll do a PR if I have a decent solution :)

[spoenemann]

Might be that Puppeteer can help with that, but I never tried it.