AngularRouteExplorer

February 14, 2026 · View on GitHub

A fast, standalone CLI tool for analyzing Angular project route configurations. Built in Rust, it performs static analysis on TypeScript and HTML source files -- no Node.js or Angular CLI required.

Features

Component Route Finder -- Given a component file, find every route where it is used (directly in route config or embedded via selector in templates).
Route Tree Generator -- Scan an Angular project and produce a full route tree with guards, resolvers, and lazy-loading boundaries. Output as terminal text, Markdown, HTML, or JSON.
Broad Angular support -- Handles standalone routes (Angular 17+), NgModule RouterModule patterns, loadChildren, loadComponent, functional and class-based guards/resolvers.
Workspace aware -- Supports standard Angular CLI projects and Nx monorepos.

Installation

Build from source

Requires Rust 1.85+ (edition 2024).

git clone https://github.com/your-org/AngularRouteExplorer.git
cd AngularRouteExplorer
cargo build --release

The binary is at target/release/angular-route-explorer (or .exe on Windows).

Add to PATH

Add the .exe as a PATH environment variable.

Quick Start

Navigate to your Angular project root (or use -p to point to it) and run:

# Print the full route tree to the terminal
angular-route-explorer route-tree

# Generate a Markdown doc of all routes
angular-route-explorer route-tree --format markdown

# Find which routes use a specific component
angular-route-explorer find-component src/app/shared/header/header.component.ts

Usage

Global Options

Option	Short	Description
`--project-root <PATH>`	`-p`	Root directory of the Angular project or Nx workspace. Defaults to `.`
`--verbose`	`-v`	Increase verbosity. Use `-v` for info, `-vv` for debug, `-vvv` for trace
`--help`	`-h`	Print help
`--version`	`-V`	Print version

`route-tree` -- Generate Route Documentation

angular-route-explorer route-tree [OPTIONS]

Scans the project for route configurations and outputs a hierarchical route tree.

Option	Short	Description	Default
`--format <FORMAT>`	`-f`	Output format: `terminal`, `markdown`, `html`, `json`	`terminal`
`--output-dir <PATH>`	`-o`	Directory for file output (markdown/html)	`./route-tree-output`
`--app <NAME>`	`-a`	App to analyze (required for Nx monorepos with multiple apps)	auto-detect
`--max-depth <N>`	`-d`	Maximum nesting depth to display. `0` = unlimited	`0`

Examples

# Terminal output (default)
angular-route-explorer route-tree

# Markdown file
angular-route-explorer route-tree --format markdown --output-dir ./docs

# HTML file with collapsible tree, guards, and resolver badges
angular-route-explorer route-tree --format html -o ./docs

# JSON to stdout (pipe to jq, etc.)
angular-route-explorer route-tree --format json | jq '.routes'

# Limit depth for large projects
angular-route-explorer route-tree --max-depth 3

# Nx monorepo -- specify which app
angular-route-explorer route-tree -p /path/to/nx-workspace --app my-app

Terminal Output

Route Tree for: my-app
Source: src/app/app.routes.ts

/
+-- (empty path) [HomeComponent]
+-- about [AboutComponent]
+-- admin ** LAZY **
|   +-- (empty path) [AdminDashboardComponent]
|   +-- users [UsersListComponent]
|   |   +-- :id [UserDetailComponent]
|   |       Guards: [canActivate: isAuthenticated]
|   |       Resolvers: {user: userResolver}
+-- ** [NotFoundComponent]

Summary:
  Total routes:      6
  Lazy boundaries:   1
  Guards used:       1
  Resolvers used:    1

Markdown Output

Generates a route-tree.md file with:

Route hierarchy table (path, component, lazy status, guards, resolvers, redirects)
Lazy-loading boundaries summary
Guards summary
Resolvers summary

HTML Output

Generates a self-contained route-tree.html file with:

Collapsible tree view using <details>/<summary>
Color-coded badges (lazy = yellow, guards = red, resolvers = blue, redirects = green)
Search/filter input to quickly find routes
No external dependencies -- works offline

`find-component` -- Find Routes for a Component

angular-route-explorer find-component [OPTIONS] <COMPONENT_PATH>

Finds all routes where a given component is used.

Argument/Option	Short	Description	Default
`<COMPONENT_PATH>`	--	Path to the `.component.ts` file (relative to project root)	required
`--format <FORMAT>`	`-f`	Output format: `terminal`, `json`	`terminal`
`--include-selectors`	--	Also search HTML templates for the component's selector	off

Examples

# Find direct route assignments for a component
angular-route-explorer find-component src/app/home/home.component.ts

# Also find where the component is embedded in templates of routed components
angular-route-explorer find-component src/app/shared/header/header.component.ts --include-selectors

# JSON output for scripting
angular-route-explorer find-component src/app/home/home.component.ts --format json

# Different project root
angular-route-explorer find-component src/app/dashboard.component.ts -p /path/to/project

Terminal Output

Component: HeaderComponent
File:      src/app/shared/header/header.component.ts
Selector:  app-header

ROUTED REFERENCES (direct route assignments):
  (none found)

NON-ROUTED REFERENCES (template embedding):
  Host Route Path  | Host Component  | Template File
  ---------------- | --------------- | ------------------------------------------
  /home            | HomeComponent   | src/app/home/home.component.html:3

Total: 0 routed, 1 non-routed

Supported Angular Patterns

The tool recognizes these route configuration patterns:

Pattern	Example
Standalone routes	`export const routes: Routes = [...]`
NgModule RouterModule	`RouterModule.forRoot(routes)` / `RouterModule.forChild(routes)`
`provideRouter`	`provideRouter(routes)`
Lazy components	`loadComponent: () => import('./x').then(m => m.X)`
Lazy modules	`loadChildren: () => import('./x').then(m => m.XModule)`
Functional guards	`canActivate: [authGuard]`
Class-based guards	`canActivate: [AuthGuard]`
Functional resolvers	`resolve: { user: userResolver }`
Redirect routes	`{ path: '', redirectTo: '/home', pathMatch: 'full' }`
Wildcard routes	`{ path: '**', component: NotFoundComponent }`
Named outlets	`{ path: 'popup', outlet: 'modal', component: X }`
Custom matchers	`{ matcher: customUrlMatcher, component: X }`
Route titles	`{ path: 'about', title: 'About Us', component: X }`
Nested children	`{ path: 'admin', children: [...] }`
Spread arrays	`[...featureRoutes, { path: '**', component: X }]`

Workspace Support

Workspace Type	Detection	Notes
Angular CLI	`angular.json` in project root	Single or multi-project
Nx monorepo	`nx.json` in workspace root	Use `--app` to select the target app
Fallback	`package.json` with `@angular/core`	Scans from project root

For Nx monorepos, the tool reads tsconfig.base.json path mappings to resolve library imports (e.g., @myorg/shared).

Exit Codes

Code	Meaning
`0`	Success
`1`	General error (I/O failure, invalid arguments)
`2`	Configuration error (not an Angular project, ambiguous Nx app)
`3`	Component not found or file is not a component
`4`	No route configurations found in the project

Development

# Run all tests
cargo test

# Lint
cargo clippy

# Format
cargo fmt

# Build optimized release binary
cargo build --release

License

MIT