GitDiagram
Browse

GitDiagram vs dependency-cruiser: architecture overview or exact dependency rules

Written by GitDiagram. Facts about dependency-cruiser checked against its own docs on (sources).

dependency-cruiser and GitDiagram answer different questions. dependency-cruiser reads every import in a JavaScript or TypeScript project and gives an exact, complete dependency graph, and it checks rules you write, such as no circular dependencies or "the UI must not import the database", failing the build when one breaks. GitDiagram gives an AI-made overview of any GitHub repository, in any language, with nothing to install. Choose dependency-cruiser for exact answers and enforcing architecture in CI; choose GitDiagram for a quick picture of how a repository is organized. Many teams would use both.

Which to choose

Choose dependency-cruiser whenChoose GitDiagram when
You need every module and import, with nothing left out.You want the main parts and how they connect, not every file.
You want to fail CI on circular dependencies, orphans or forbidden imports.The repository is in Python, Go, Rust, Java or another language.
Your code is JavaScript or TypeScript (including Vue and Svelte).You don't want to clone or install anything.
The code must not leave your machine.You want connections described in words ("dispatches request"), not only arrows between files.

The same repository in both

We ran dependency-cruiser 18.7.2 on Express's lib folder (commit 43fca52, 2026-11-02) on 2026-11-09, with no configuration. It found 41 modules and 51 dependencies: Express's 6 files, 7 Node.js built-ins and 28 npm packages (unresolved, because we did not install them). Limited to lib, its Mermaid output is the exact file graph:

npx depcruise lib --no-config --include-only "^lib" --output-type mermaid
flowchart LR

subgraph 0["lib"]
1["application.js"]
2["utils.js"]
3["view.js"]
4["express.js"]
5["request.js"]
6["response.js"]
end
1-->2
1-->3
4-->1
4-->5
4-->6
6-->2

What GitDiagram shows for it

GitDiagram's Express diagram has 16 components in 5 groups with 21 labeled connections. Besides Express's own files it shows what they work with: the HTTP client, Node's HTTP server, the separate router package, template engines, the filesystem and the final error handler, with connections such as "dispatches request" and "augments response". It is an interpretation, not a parse: dependency-cruiser's six arrows are exact, GitDiagram's picture is the one a person would draw on a whiteboard.

What dependency-cruiser does

dependency-cruiser validates and visualizes dependencies for JavaScript, TypeScript, LiveScript and CoffeeScript (ES modules, CommonJS and AMD), including .jsx, .tsx, .vue and .svelte files, using the compilers already in your project. Install it with npm install --save-dev dependency-cruiser and run npx depcruise --init to get a configuration with sensible rules (no circular dependencies, no orphans, nothing missing from package.json).

Its rules are forbidden patterns with a severity; with the err reporter the exit code is the number of errors, so CI fails when a rule breaks. It reports in many formats, among them dot (Graphviz), Mermaid, D2, HTML, JSON, CSV and Markdown; images need Graphviz installed. It is MIT licensed and actively released (18.7.2 on 2026-11-02). It cannot follow imports built from variables (require(someVariable)), and its own FAQ warns that graphs of large projects get huge.

What GitDiagram does

Replace hub with diagram in a GitHub URL. An AI model reads the file tree, README and up to 12 source files and draws the main components; you can export the result as Mermaid.

GitDiagram's limits: it is a map of the important parts, not a complete dependency graph. It can simplify or leave things out, it works only with GitHub repositories, and it shows the repository as it was when the diagram was made (Regenerate makes a fresh one).

At a glance

QuestionGitDiagramdependency-cruiser
What you getOne interactive architecture diagram: up to 34 main components in groups, with labeled connections and a written overview. Each component links to its file or folder on GitHub.An exact module graph and rule violations, in formats such as dot, Mermaid, D2, HTML and JSON.
LanguagesAny language in a GitHub repository.JavaScript, TypeScript, LiveScript and CoffeeScript, with Vue and Svelte files.
SetupNone. Replace hub with diagram in a GitHub URL, or paste the URL on the home page.Install from npm in your project; Graphviz for images. Runs on your machine or in CI.
Private codeYes, with a fine-grained GitHub token that stays in your browser and is never saved on GitDiagram's servers.Yes: it runs locally, so the code stays where it is.
PriceFree. Making new diagrams is free within a shared daily limit; after that you can add your own OpenAI API key.Free, MIT.

Questions

How do I find circular dependencies in a JavaScript project?

Run npx depcruise --init, which adds a no-circular rule, then npx depcruise src; it lists every cycle and exits with an error code. Madge's madge --circular src is a quicker one-off check.

Does GitDiagram enforce architecture rules?

No. GitDiagram draws an overview; it does not check imports or run in CI. Use dependency-cruiser for that.

Can dependency-cruiser output Mermaid?

Yes, with --output-type mermaid, as in the Express example on this page.

Sources

Checked on . Products change: if something here is out of date, open an issue.