Next.js DevTools

next-devtools-mcp is a Model Context Protocol (MCP) server that provides Next.js development tools and utilities for AI coding assistants.

50K+5 ToolsPackaged by

Overview Tools (5)

Docker Hub Github repository

Tools

Name Description

enable_cache_components Complete Cache Components setup for Next.js 16. Handles ALL steps for enabling and verifying Cache Components: - Configuration: Updates cacheComponents flag (experimental in 16.0.0, stable in canary > 16), removes incompatible flags - Dev Server: Starts dev server with MCP enabled (__NEXT_EXPERIMENTAL_MCP_SERVER=true) - Error Detection: Loads all routes via browser automation, collects errors using Next.js MCP - Automated Fixing: Adds Suspense boundaries, "use cache" directives, generateStaticParams, cacheLife profiles, cache tags - Verification: Validates all routes work with zero errors Key Features: - One-time dev server start (no restarts needed) - Automated error detection using Next.js MCP tools - Browser-based testing with browser automation - Fast Refresh applies fixes instantly - Comprehensive fix strategies for all error types - Support for "use cache", "use cache: private", Suspense boundaries - Cache invalidation with cacheTag() and cacheLife() configuration Requires: - Next.js 16.0.0+ (stable or canary only - beta versions are NOT supported) - Clean working directory preferred - Browser automation installed (auto-installed if needed) This tool embeds complete knowledge base for: - Cache Components mechanics - Error patterns and solutions - Caching strategies (static vs dynamic) - Advanced patterns (cacheLife, cacheTag, draft mode) - Build behavior and prefetching - Test-driven patterns from 125+ fixtures

Name	Description
`enable_cache_components`	Complete Cache Components setup for Next.js 16. Handles ALL steps for enabling and verifying Cache Components: - Configuration: Updates cacheComponents flag (experimental in 16.0.0, stable in canary > 16), removes incompatible flags - Dev Server: Starts dev server with MCP enabled (__NEXT_EXPERIMENTAL_MCP_SERVER=true) - Error Detection: Loads all routes via browser automation, collects errors using Next.js MCP - Automated Fixing: Adds Suspense boundaries, "use cache" directives, generateStaticParams, cacheLife profiles, cache tags - Verification: Validates all routes work with zero errors Key Features: - One-time dev server start (no restarts needed) - Automated error detection using Next.js MCP tools - Browser-based testing with browser automation - Fast Refresh applies fixes instantly - Comprehensive fix strategies for all error types - Support for "use cache", "use cache: private", Suspense boundaries - Cache invalidation with cacheTag() and cacheLife() configuration Requires: - Next.js 16.0.0+ (stable or canary only - beta versions are NOT supported) - Clean working directory preferred - Browser automation installed (auto-installed if needed) This tool embeds complete knowledge base for: - Cache Components mechanics - Error patterns and solutions - Caching strategies (static vs dynamic) - Advanced patterns (cacheLife, cacheTag, draft mode) - Build behavior and prefetching - Test-driven patterns from 125+ fixtures