Dependency · Diagram Design

TypeScript monorepo dependency graph

Nine packages, ranked by dependency depth. A tree can't show what matters here — that shared-types has four dependents, or that utils depends back on it. Coral is spent on exactly that cycle.

TypeScript monorepo dependency graph Ranked dependency graph of a TypeScript monorepo showing shared-types as the highest fan-in package with four dependents, and one back-edge cycle from utils into shared-types. RANK 0 RANK 1 RANK 2 RANK 3 CYCLE APP 0 IN web apps/web APP 0 IN admin apps/admin SVC 2 IN api services/api PKG 2 IN ui-kit packages/ui-kit PKG 4 IN shared-types packages/shared-types SVC 1 IN db services/db PKG 1 IN tokens packages/tokens PKG 1 IN utils packages/utils EXT 1 IN zod v3.23 · npm LEGEND Internal package External / third-party Leaf (no outgoing) Cycle (back-edge) Badges show fan-in — a tree can't express convergence.

THE HEADLINE

One cycle, spent deliberately

Coral appears exactly twice: the dashed back-edge from utils into shared-types, and its CYCLE label. Everything else — including the four-dependent fan-in on shared-types — stays ink and muted, because only the cycle is the editorial point.

Why not a tree

  • shared-types has four parents, not one
  • utils depends back on its own ancestor
  • a tree can render neither honestly

Read the badges

The small N IN chip on every node is the fan-in count. It's the fastest way to spot where a change ripples widest before reading a single arrow.

typescript monorepo dependency graph example · diagram design