What can next-devtools-mcp do?

next.js project introspection via mcp protocol, next.js route and page discovery, development server lifecycle management via mcp, file-based context injection for code generation, typescript/javascript type information exposure, environment variable and secrets management interface, build and compilation error reporting, performance metrics and bundle analysis

next-devtools-mcp

MCP ServerFree

Next.js development tools MCP server with stdio transport

Open Source

/ 100

8 capabilities

Capabilities8 decomposed

next.js project introspection via mcp protocol

Medium confidence

Exposes Next.js project metadata and configuration through the Model Context Protocol (MCP) using stdio transport, allowing Claude and other MCP-compatible clients to query project structure, routes, pages, and configuration without direct filesystem access. Implements MCP resource and tool schemas to standardize how LLMs interact with Next.js-specific project information.

Solves for

Query Next.js project structure and routing configuration from ClaudeRetrieve page and component metadata for code generation contextInspect Next.js configuration (next.config.js) programmatically via MCPEnable Claude to understand project layout before suggesting code changes

Best for

AI-assisted Next.js development workflows using Claude

Teams building LLM agents that need to understand Next.js projects

Developers using Claude Desktop or MCP-compatible IDEs

Requires

Node.js 16+

Next.js 12+ project

MCP-compatible client (Claude Desktop, Cline, etc.)

Limitations

Requires MCP client support — not compatible with REST APIs or direct SDK usage

Limited to stdio transport — no network/HTTP transport option

Project introspection is read-only; cannot modify configuration via MCP

What makes it unique

Purpose-built MCP server specifically for Next.js with stdio transport, providing structured access to Next.js-specific metadata (App Router, Pages Router, middleware) through standardized MCP resource and tool schemas rather than generic filesystem access

vs alternatives

More specialized than generic MCP filesystem servers because it understands Next.js semantics (routes, pages, API handlers) and exposes them as first-class MCP resources, enabling Claude to reason about project structure without parsing configuration files

next.js route and page discovery

Medium confidence

Automatically discovers and catalogs all Next.js routes (App Router and Pages Router), page components, API routes, and middleware through AST parsing and filesystem scanning. Exposes discovered routes as MCP resources with metadata including route parameters, HTTP methods, and component locations, enabling LLMs to understand the complete routing topology without manual configuration.

Solves for

Get a complete list of all routes in a Next.js projectUnderstand route parameter patterns and dynamic segmentsIdentify which API routes exist and their HTTP methodsLocate page components and their file paths for context injection

Best for

LLM-assisted code generation for new pages or API routes

AI agents that need to understand existing routing before suggesting changes

Developers using Claude to refactor or extend Next.js applications

Requires

Next.js 12+ with either App Router or Pages Router

Readable filesystem access to project root

Valid next.config.js or default Next.js configuration

Limitations

Route discovery may miss dynamically-generated routes created at runtime

Requires filesystem access to scan project directories

No support for routes defined outside standard Next.js directories

What makes it unique

Implements dual-mode route discovery supporting both Next.js App Router (file-based routing with dynamic segments) and legacy Pages Router, with automatic detection of route type and parameter extraction from file paths and segment conventions

vs alternatives

More comprehensive than static route listing because it parses dynamic segments, extracts parameter names from bracket notation, and distinguishes between page routes and API routes, providing LLMs with actionable routing metadata

development server lifecycle management via mcp

Medium confidence

Provides MCP tools to start, stop, and monitor the Next.js development server (next dev) as a subprocess, with stdio/stderr capture and process state tracking. Enables LLM clients to control the dev server lifecycle without direct shell access, integrating server status into the MCP context for real-time feedback on compilation and runtime errors.

Solves for

Start the Next.js dev server from Claude without manual terminal commandsStop or restart the dev server when needed for configuration changesMonitor dev server logs and compilation errors in real-timeDetect when the dev server is ready to accept requests

Best for

Automated Next.js development workflows in Claude Desktop

LLM agents that need to test code changes by running the dev server

Developers using Claude to iterate on Next.js projects with live feedback

Requires

Node.js 16+

Next.js 12+ project with valid package.json

npm or yarn installed and available in PATH

Limitations

Subprocess management adds complexity — requires proper cleanup on client disconnect

Dev server output (stdout/stderr) may be voluminous; requires filtering/buffering

No built-in support for custom dev server configurations (port, hostname)

What makes it unique

Wraps Next.js dev server as an MCP-controlled subprocess with integrated stdio capture and state tracking, allowing LLMs to manage server lifecycle as part of the MCP conversation context rather than requiring external terminal interaction

vs alternatives

More integrated than shell-based dev server management because it provides structured MCP tools with state awareness and error capture, enabling Claude to react to server events and logs within the conversation flow

file-based context injection for code generation

Medium confidence

Implements MCP resources that expose Next.js project files (pages, components, API routes, config) as readable context that Claude can request on-demand. Uses lazy-loading and caching to avoid overwhelming context windows, with support for filtering by file type, directory, or pattern to provide targeted code context for generation tasks.

Solves for

Provide Claude with existing component code as reference for new componentsShare API route examples to maintain consistency in new endpointsExpose configuration files (next.config.js, tsconfig.json) for contextAllow Claude to read related files before suggesting changes

Best for

Code generation workflows where Claude needs to match existing patterns

Refactoring tasks that require understanding current implementation

Teams with style guides or architectural patterns in code

Requires

Readable filesystem access to project files

Next.js project with TypeScript or JavaScript files

MCP client with sufficient context window for file contents

Limitations

Large files or many files can exceed Claude's context window

No built-in syntax highlighting or code formatting in MCP response

Binary files or non-text files cannot be exposed via MCP

What makes it unique

Implements lazy-loaded MCP resources for project files with optional caching and filtering, allowing Claude to request specific files or directories on-demand rather than pre-loading entire project context, reducing token usage for large projects

vs alternatives

More efficient than sending entire project as context because it uses MCP resource requests to load files on-demand, with filtering options to provide only relevant code samples, reducing context window pressure

typescript/javascript type information exposure

Medium confidence

Extracts and exposes TypeScript type definitions, interfaces, and type information from the Next.js project through MCP resources, enabling Claude to understand component props, API response types, and function signatures. Uses TypeScript compiler API or similar to parse type annotations and generate type documentation accessible via MCP.

Solves for

Understand component prop types before generating new componentsKnow API response types when generating API route handlersAccess type definitions for shared utilities and helpersGenerate type-safe code that matches existing type contracts

Best for

TypeScript-based Next.js projects with strict type checking

Teams that want Claude to generate type-safe code

Projects with complex type hierarchies or generic types

Requires

TypeScript 4.0+ installed in project

Valid tsconfig.json with proper configuration

Next.js project with .ts or .tsx files

Limitations

Requires TypeScript to be installed and configured in project

Complex generic types may be difficult to represent in text format

Type inference may be incomplete without full project compilation

What makes it unique

Extracts TypeScript type information from the project and exposes it as MCP resources, allowing Claude to access type definitions without parsing source code, enabling type-aware code generation that respects existing type contracts

vs alternatives

More precise than inferring types from code comments or examples because it uses TypeScript compiler API to extract actual type definitions, ensuring Claude generates code that matches the project's type system

environment variable and secrets management interface

Medium confidence

Provides MCP tools to read and validate environment variables from .env, .env.local, and .env.production files without exposing sensitive values directly. Implements safe access patterns that allow Claude to understand what environment variables are available and their expected types/formats while preventing accidental exposure of secrets in conversation logs.

Solves for

Understand what environment variables are available in the projectKnow which variables are required for API routes or componentsGenerate code that correctly references environment variablesValidate that required environment variables are configured

Best for

Projects with environment-dependent configuration

Teams that want Claude to generate code using correct env var names

Security-conscious teams that need to prevent secret exposure

Requires

.env or .env.local file in project root

Readable filesystem access to env files

Next.js project with environment variable usage

Limitations

Cannot expose actual secret values to Claude (by design)

Requires .env files to be readable by MCP server process

No support for runtime environment variable injection

What makes it unique

Implements safe environment variable access that exposes variable names and metadata without revealing actual secret values, using a whitelist/metadata approach to allow Claude to generate correct code while preventing accidental secret exposure

vs alternatives

More secure than exposing raw .env files because it provides a controlled interface that lists available variables and their expected types without revealing sensitive values, reducing risk of secrets leaking in conversation logs

build and compilation error reporting

Medium confidence

Captures and exposes Next.js build errors, TypeScript compilation errors, and ESLint warnings through MCP resources, providing structured error information including file paths, line numbers, error messages, and suggested fixes. Integrates with the dev server to report errors in real-time as code changes are made.

Solves for

Get detailed error information when code generation produces invalid codeUnderstand TypeScript compilation errors in generated componentsAccess ESLint warnings to improve code qualityProvide error context to Claude for iterative code fixes

Best for

Iterative code generation workflows where Claude needs error feedback

Projects with strict TypeScript or ESLint configurations

Teams that want Claude to self-correct based on build errors

Requires

Next.js dev server running

TypeScript or JavaScript project

Optional: ESLint configuration for linting errors

Limitations

Error reporting depends on dev server being active

Some errors may only appear during full build, not in dev mode

Error messages may be verbose or unclear without additional context

What makes it unique

Integrates with Next.js dev server to capture real-time build and compilation errors and expose them as MCP resources with structured metadata, enabling Claude to receive immediate feedback on generated code without manual error checking

vs alternatives

More actionable than raw build output because it parses errors into structured format with file locations and line numbers, allowing Claude to understand exactly what went wrong and where, enabling targeted code fixes

performance metrics and bundle analysis

Medium confidence

Exposes Next.js performance metrics (build time, bundle size, page load metrics) and provides MCP tools to analyze bundle composition, identify large dependencies, and track performance regressions. Integrates with Next.js built-in analytics and optional tools like Bundle Analyzer to provide actionable performance insights.

Solves for

Understand current bundle size and identify optimization opportunitiesTrack performance impact of code changesIdentify large dependencies that could be replaced or removedGenerate performance-optimized code that avoids unnecessary imports

Best for

Performance-critical Next.js applications

Teams that want Claude to generate bundle-size-aware code

Projects with strict performance budgets

Requires

Next.js 12+ with build analytics enabled

Optional: @next/bundle-analyzer or similar tool

Sufficient disk space for build artifacts

Limitations

Requires build to complete for accurate metrics

Bundle analysis may be slow for large projects

Performance metrics vary based on build configuration and environment

What makes it unique

Integrates Next.js build analytics with MCP to expose bundle composition and performance metrics as queryable resources, enabling Claude to make performance-aware code generation decisions based on actual bundle impact

vs alternatives

More integrated than standalone bundle analyzers because it provides MCP-accessible performance data within the Claude conversation context, allowing Claude to consider bundle size when generating code

Capabilities are decomposed by AI analysis. Each maps to specific user intents and improves with match feedback.

Related Artifactssharing capabilities

Artifacts that share capabilities with next-devtools-mcp, ranked by overlap. Discovered automatically through the match graph.

MCP Server38

next-devtools-mcp

Next.js development tools MCP server with stdio transport

next.js development server introspection via mcp protocolroute and page metadata extraction from next.js app directorymiddleware configuration and execution order inspection

3 shared capabilities

MCP Server24

Next.js MCP Server Template

** (Typescript) - A starter Next.js project that uses the MCP Adapter to allow MCP clients to connect and access resources.

next.js app router-based endpoint routing for mcp protocolmcp client library integration (sse and http clients)

2 shared capabilities

MCP Server37

xmcp

The TypeScript MCP framework

integration with next.js and express frameworksfile system-based routing for mcp tools, prompts, and resources

2 shared capabilities

MCP Server21

@modelcontextprotocol/server-basic-svelte

Basic MCP App Server example using Svelte

development server with hot module reloading for mcp + sveltemcp server initialization with svelte framework integration

2 shared capabilities

MCP Server21

@modelcontextprotocol/server-basic-vue

Basic MCP App Server example using Vue

mcp server lifecycle management with vue app initializationmcp server instantiation with vue framework integration

2 shared capabilities

MCP Server23

Open-Sourced MCP Servers Directory

** - A curated list of MCP servers by **[mcpso](https://mcp.so)**

responsive web ui with next.js pages and react componentsproject detail pages with markdown rendering and installation instructions

2 shared capabilities

Best For

✓AI-assisted Next.js development workflows using Claude
✓Teams building LLM agents that need to understand Next.js projects
✓Developers using Claude Desktop or MCP-compatible IDEs
✓LLM-assisted code generation for new pages or API routes
✓AI agents that need to understand existing routing before suggesting changes
✓Developers using Claude to refactor or extend Next.js applications
✓Automated Next.js development workflows in Claude Desktop
✓LLM agents that need to test code changes by running the dev server

Known Limitations

⚠Requires MCP client support — not compatible with REST APIs or direct SDK usage
⚠Limited to stdio transport — no network/HTTP transport option
⚠Project introspection is read-only; cannot modify configuration via MCP
⚠Depends on Next.js project being properly initialized with valid configuration
⚠Route discovery may miss dynamically-generated routes created at runtime
⚠Requires filesystem access to scan project directories

Requirements

Node.js 16+Next.js 12+ projectMCP-compatible client (Claude Desktop, Cline, etc.)stdio transport capability in client environmentNext.js 12+ with either App Router or Pages RouterReadable filesystem access to project rootValid next.config.js or default Next.js configurationNext.js 12+ project with valid package.json

Input / Output

Accepts: MCP resource requests (JSON-RPC), MCP tool invocations (JSON-RPC), MCP resource request for routes, MCP tool invocation with optional filters, MCP tool invocation (start, stop, status), Optional configuration parameters (port, hostname), MCP resource request with file path or pattern, Optional filters (file type, directory, size limits), MCP resource request for type information, Optional file path or symbol name, MCP tool invocation to list env variables, Optional filter for variable names or patterns, MCP resource request for current errors, Optional file path filter, MCP tool invocation to analyze bundle, Optional filters for specific pages or routes

Produces: JSON project metadata, Route definitions, Configuration objects, File structure representations, JSON array of route objects, Route metadata (path, methods, parameters), Component file paths and locations, Process status (running, stopped, error), Dev server logs and error messages, Ready state confirmation, File contents as text, File metadata (size, type, modification time), Directory listings with file metadata, Type definitions in text format, Interface and type alias documentation, Function signature information, List of available environment variable names, Variable metadata (required, type, description), Validation results (missing, invalid format), Structured error objects with file, line, column, message, Error severity (error, warning), Suggested fixes or related documentation, Bundle size metrics (total, per-page, per-dependency), Dependency analysis (size, count, duplicates), Performance recommendations

UnfragileRank

Adoption62%(30% weight)

Quality17%(25% weight)

Ecosystem30%(25% weight)

Match Graph10%(15% weight)

Freshness75%(5% weight)

UnfragileRank is computed from adoption signals, documentation quality, ecosystem connectivity, match graph feedback, and freshness. No artifact can pay for a higher rank.

Type: MCP Server

8 capabilities

Visit next-devtools-mcp→

Package Details

npm

Registry

0.3.10

Version

64,936

Weekly Downloads

About

Next.js development tools MCP server with stdio transport

Alternatives to next-devtools-mcp

IntelliCode50Extension

AI-assisted development

Compare →

GitHub Copilot Chat53Extension

AI chat features powered by Copilot

Compare →

GitHub Copilot52Extension

Your AI pair programmer

Compare →

Claude Code for VS Code52Extension

Claude Code for VS Code: Harness the power of Claude Code without leaving your IDE

Compare →

Are you the builder of next-devtools-mcp?

Claim this artifact to get a verified badge, access match analytics, see which intents users search for, and manage your listing.

Claim this artifact →Verification via email

Get the weekly brief

New tools, rising stars, and what's actually worth your time. No spam.

Data Sources

mcp registry

Looking for something else?

Search →

Capabilities8 decomposed

next.js project introspection via mcp protocol

Medium confidence

Solves for

Best for

AI-assisted Next.js development workflows using Claude

Teams building LLM agents that need to understand Next.js projects

Developers using Claude Desktop or MCP-compatible IDEs

Requires

Node.js 16+

Next.js 12+ project

MCP-compatible client (Claude Desktop, Cline, etc.)

Limitations

Requires MCP client support — not compatible with REST APIs or direct SDK usage

Limited to stdio transport — no network/HTTP transport option

Project introspection is read-only; cannot modify configuration via MCP

What makes it unique

vs alternatives

next.js route and page discovery

Medium confidence

Solves for

Best for

LLM-assisted code generation for new pages or API routes

AI agents that need to understand existing routing before suggesting changes

Developers using Claude to refactor or extend Next.js applications

Requires

Next.js 12+ with either App Router or Pages Router

Readable filesystem access to project root

Valid next.config.js or default Next.js configuration

Limitations

Route discovery may miss dynamically-generated routes created at runtime

Requires filesystem access to scan project directories

No support for routes defined outside standard Next.js directories

What makes it unique

vs alternatives

development server lifecycle management via mcp

Medium confidence

Solves for

Best for

Automated Next.js development workflows in Claude Desktop

LLM agents that need to test code changes by running the dev server

Developers using Claude to iterate on Next.js projects with live feedback

Requires

Node.js 16+

Next.js 12+ project with valid package.json

npm or yarn installed and available in PATH

Limitations

Subprocess management adds complexity — requires proper cleanup on client disconnect

Dev server output (stdout/stderr) may be voluminous; requires filtering/buffering

No built-in support for custom dev server configurations (port, hostname)

What makes it unique

vs alternatives

file-based context injection for code generation

Medium confidence

Solves for

Best for

Code generation workflows where Claude needs to match existing patterns

Refactoring tasks that require understanding current implementation

Teams with style guides or architectural patterns in code

Requires

Readable filesystem access to project files

Next.js project with TypeScript or JavaScript files

MCP client with sufficient context window for file contents

Limitations

Large files or many files can exceed Claude's context window

No built-in syntax highlighting or code formatting in MCP response

Binary files or non-text files cannot be exposed via MCP

What makes it unique

vs alternatives

typescript/javascript type information exposure

Medium confidence

Solves for

Best for

TypeScript-based Next.js projects with strict type checking

Teams that want Claude to generate type-safe code

Projects with complex type hierarchies or generic types

Requires

TypeScript 4.0+ installed in project

Valid tsconfig.json with proper configuration

Next.js project with .ts or .tsx files

Limitations

Requires TypeScript to be installed and configured in project

Complex generic types may be difficult to represent in text format

Type inference may be incomplete without full project compilation

What makes it unique

vs alternatives

environment variable and secrets management interface

Medium confidence

Solves for

Best for

Projects with environment-dependent configuration

Teams that want Claude to generate code using correct env var names

Security-conscious teams that need to prevent secret exposure

Requires

.env or .env.local file in project root

Readable filesystem access to env files

Next.js project with environment variable usage

Limitations

Cannot expose actual secret values to Claude (by design)

Requires .env files to be readable by MCP server process

No support for runtime environment variable injection

What makes it unique

vs alternatives

build and compilation error reporting

Medium confidence

Solves for

Best for

Iterative code generation workflows where Claude needs error feedback

Projects with strict TypeScript or ESLint configurations

Teams that want Claude to self-correct based on build errors

Requires

Next.js dev server running

TypeScript or JavaScript project

Optional: ESLint configuration for linting errors

Limitations

Error reporting depends on dev server being active

Some errors may only appear during full build, not in dev mode

Error messages may be verbose or unclear without additional context

What makes it unique

vs alternatives

performance metrics and bundle analysis

Medium confidence

Solves for

Best for

Performance-critical Next.js applications

Teams that want Claude to generate bundle-size-aware code

Projects with strict performance budgets

Requires

Next.js 12+ with build analytics enabled

Optional: @next/bundle-analyzer or similar tool

Sufficient disk space for build artifacts

Limitations

Requires build to complete for accurate metrics

Bundle analysis may be slow for large projects

Performance metrics vary based on build configuration and environment

What makes it unique

vs alternatives

Capabilities are decomposed by AI analysis. Each maps to specific user intents and improves with match feedback.

Alternatives to next-devtools-mcp

IntelliCode50Extension

AI-assisted development

Compare →

GitHub Copilot Chat53Extension

AI chat features powered by Copilot

Compare →

GitHub Copilot52Extension

Your AI pair programmer

Compare →

Claude Code for VS Code52Extension

Claude Code for VS Code: Harness the power of Claude Code without leaving your IDE

Compare →

next-devtools-mcp

Capabilities8 decomposed

next.js project introspection via mcp protocol

next.js route and page discovery

development server lifecycle management via mcp

file-based context injection for code generation

typescript/javascript type information exposure

environment variable and secrets management interface

build and compilation error reporting

performance metrics and bundle analysis

Related Artifactssharing capabilities

next-devtools-mcp

Next.js MCP Server Template

xmcp

@modelcontextprotocol/server-basic-svelte

@modelcontextprotocol/server-basic-vue

Open-Sourced MCP Servers Directory

Best For

Known Limitations

Requirements

Input / Output

UnfragileRank

Package Details

About

Categories

Alternatives to next-devtools-mcp

Are you the builder of next-devtools-mcp?

Get the weekly brief

Data Sources

next-devtools-mcp

Capabilities8 decomposed

next.js project introspection via mcp protocol

next.js route and page discovery

development server lifecycle management via mcp

file-based context injection for code generation

typescript/javascript type information exposure

environment variable and secrets management interface

build and compilation error reporting

performance metrics and bundle analysis

Related Artifactssharing capabilities

next-devtools-mcp

Next.js MCP Server Template

xmcp

@modelcontextprotocol/server-basic-svelte

@modelcontextprotocol/server-basic-vue

Open-Sourced MCP Servers Directory

Best For

Known Limitations

Requirements

Input / Output

UnfragileRank

Package Details

About

Categories

Alternatives to next-devtools-mcp

Are you the builder of next-devtools-mcp?

Get the weekly brief

Data Sources