Claude Explorer

Visual graph explorer for Claude Code .claude/ folders. See how your agents, skills, rules, hooks, and MCP servers connect — in one interactive graph that updates on every save.

Screenshot coming soon — run npm run explore to see the live graph in your browser.

Installation

Claude Explorer is installed as a local devDependency in your repo. You decide at which level to install it — that determines the scope of what it visualizes.

Repo singolo

# npm
npm install --save-dev @mora2297/claude-explorer

# yarn
yarn add -D @mora2297/claude-explorer

# pnpm
pnpm add -D @mora2297/claude-explorer

Monorepo o pnpm workspace

Install at the workspace root to visualize all .claude/ configurations across every sub-project:

pnpm add -D @mora2297/claude-explorer -w

The -w flag is required by pnpm when installing at the workspace root. This is expected pnpm behavior, not an error.

To visualize only a single package's configuration, install inside that package without -w.

Add a script and run

Add to your package.json:

"scripts": {
  "explore": "claude-explorer"
}

Then run from the directory where your .claude/ folder lives:

npm run explore
# or
pnpm explore
# or
yarn explore

Opens http://127.0.0.1:3847 automatically.

Multi-project support

When installed at the root of a monorepo, Claude Explorer automatically finds every .claude/ folder in sub-projects (up to 5 levels deep, skipping node_modules, .git, dist).

The UI shows a switcher to move between configurations without restarting.

monorepo-root/
├── .claude/              ← root configuration
├── apps/
│   ├── api/
│   │   └── .claude/     ← found automatically
│   └── web/
│       └── .claude/     ← found automatically
└── packages/
    └── shared/
        └── .claude/     ← found automatically

To also include the global user configuration (~/.claude/):

claude-explorer --include-user

API Key

Required. Claude Explorer uses the Anthropic API to analyze your configuration.

Get your key at console.anthropic.com → API Keys.

Set it as an environment variable:

export ANTHROPIC_API_KEY=sk-ant-...

Or add it to a .env file at your project root:

ANTHROPIC_API_KEY=sk-ant-...

If no key is configured at startup, the UI shows a setup screen where you can enter it directly.

What you see

Nodes appear in semantic columns, left to right following Claude Code's load order:

| Type | Color | Source | | ---------------- | ----------- | ------------------------------------------------- | | root-memory | violet | CLAUDE.md — root system prompt | | command | rose | commands/*.md — slash commands | | agent | violet | agents/*.md — specialized agents | | skill | emerald | skills/*/SKILL.md — reusable behaviors | | rule | sky | rules/**/*.md — prompt rules (nested supported) | | config | amber | settings.json — hooks and permissions | | local-override | gray dashed | settings.local.json | | mcp-server | gray | .mcp.json servers | | memory | teal | agent-memory/*.md — persistent agent memory |

Edges show how nodes relate. Declared connections (from frontmatter) are solid lines; inferred connections (found in body text) are semi-transparent. Toggle the legend from the controls panel.

Features

• Visual graph — semantic columns: Memory → Commands → Agents → Skills → Rules → Infra
• Edge types — explicit tool use, hook intercepts, file references, semantic similarity — declared vs. inferred
• Alert engine — detects token spikes, orphan nodes, circular dependencies, hook conflicts, unknown tool refs, missing descriptions, and more
• Live reload — file watcher refreshes the graph on every save, no manual refresh needed
• AI analysis — structural suggestions via Claude Haiku (requires API key)
• Dark / light mode — persistent across sessions

CLI options

claude-explorer [path]           path to project root (default: current directory)
claude-explorer -p 4242          custom port (also --port)
claude-explorer --include-user   include ~/.claude/ user-level configuration
claude-explorer --no-open        don't auto-open browser

Keyboard shortcuts

| Key | Action | | ---------------- | ---------------------------------- | | R | Reset layout and clear all filters | | Esc | Deselect node / close overlays | | Right-click node | Context menu |

Troubleshooting

Port already in use

Error: port 3847 is already in use.
  Run with a different port:  claude-explorer --port 3848
  Or kill the process:        lsof -ti:3847 | xargs kill

Use a different port or kill the existing instance.

API key not found

⚠  No API key found. Open the UI to configure your Anthropic API key.

Set ANTHROPIC_API_KEY as an environment variable or in a .env file at the project root. The UI shows a setup screen on first launch if no key is present.

pnpm requires the -w flag

ERR_PNPM_ADDING_TO_ROOT

In a pnpm workspace, installing at the root requires explicit confirmation via -w:

pnpm add -D @mora2297/claude-explorer -w

No .claude/ folder found

Make sure you are running claude-explorer from the right directory, or pass the path explicitly:

claude-explorer /path/to/my/project

Coming soon

• Search and filter — filter nodes by name, type, or scope
• Focus Mode — isolate any node and trace its full upstream/downstream pipeline
• Node panel — view and edit agent/skill/rule frontmatter directly from the graph

Contributing

See CONTRIBUTING.md for development setup and project structure.

License

MIT