---
name: aiskillstore/nextjs-devtools
source: https://app.decimal.ai/s/aiskillstore-nextjs-devtools@1/SKILL.md
source_sha256: ea52d557fb03
---

# Next.js DevTools

Inspect and debug Next.js applications via MCP server.

## Quick Start

```bash
# Start server (spawns on-demand)
bash scripts/start-server.sh

# Or use directly via mcp-client
python3 scripts/mcp-client.py call \
  -s "npx next-devtools-mcp@latest" \
  -t list-routes
```

## Available Tools

| Tool | Description |
|------|-------------|
| `list-routes` | Get all app routes |
| `get-route-info` | Details for specific route |
| `list-components` | React components in app |
| `get-build-info` | Build configuration |
| `get-config` | next.config.js settings |

## Workflow Patterns

### Pattern 1: Route Inspection

```bash
# List all routes
python3 scripts/mcp-client.py call \
  -s "npx next-devtools-mcp@latest" \
  -t list-routes

# Get specific route details
python3 scripts/mcp-client.py call \
  -s "npx next-devtools-mcp@latest" \
  -t get-route-info \
  -p '{"route": "/api/auth"}'
```

### Pattern 2: Debug Build Issues

```bash
# Check build config
python3 scripts/mcp-client.py call \
  -s "npx next-devtools-mcp@latest" \
  -t get-build-info

# Check next.config.js
python3 scripts/mcp-client.py call \
  -s "npx next-devtools-mcp@latest" \
  -t get-config
```

### Pattern 3: Component Discovery

```bash
python3 scripts/mcp-client.py call \
  -s "npx next-devtools-mcp@latest" \
  -t list-components
```

## Scripts

### start-server.sh

For persistent server (multiple calls):

```bash
bash scripts/start-server.sh
# Server runs on default port
# Use mcp-client.py with -u flag instead of -s
```

### On-Demand (Recommended)

For single calls, use `-s` flag which spawns server per-call:

```bash
python3 scripts/mcp-client.py call \
  -s "npx next-devtools-mcp@latest" \
  -t <tool-name>
```

## Troubleshooting

| Issue | Solution |
|-------|----------|
| Server not starting | Check `npx next-devtools-mcp@latest` works manually |
| No routes found | Ensure running from Next.js project root |
| Build info empty | Run `next build` first |