What problem does it solve? Enabling Cache Components in a Next.js app floods the build with blocking-prerender and instant-validation errors, and fixing them route by route without a plan is slow and error-prone. This Skill sequences the entire adoption: flipping the cacheComponents flag, running the cache-components-instant-false codemod, and walking the route tree until the build passes. ## Core Features & Use Cases - Strategy selection: Choose between an incremental path (codemod opts every route out first, then adopt feature-by-feature as separate PRs) or a direct path (fix whatever the build flags first). - Guided error resolution: Diagnose the three blocker classes — request-time reads (cookies(), headers(), await params), sync-IO calls (Date.now(), Math.random()), and "use cache" files reading request data — using the docs page linked from each error. - Runtime verification: Verify each fix in a real browser via the next-dev-loop skill, confirming the static shell renders and <Suspense> fallbacks resolve, not just that the build passes. - Use Case: You upgrade a Next.js 16.3+ app, set cacheComponents: true, and the build fails on dozens of routes. The Skill runs the codemod to opt routes out, fixes sync-IO blockers in shared layouts, then removes opt-outs one feature at a time until every route is a clean partial prerender. ## Quick Start Enable Cache Components in my Next.js app and work through the blocking-route errors until the build passes.
