What problem does it solve? Enabling Cache Components in a Next.js app surfaces a flood of blocking-prerender and instant-validation build errors, and fixing them route by route without a plan stalls the migration. 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 with export const instant = false, ship as one PR, then adopt feature by feature) or a direct path (fix blocking routes as the build reports them). - Guided error resolution: Classifies blockers into request-time reads (cookies(), headers(), await params), sync-IO calls (new Date(), Math.random()), and "use cache" conflicts, then applies the recipe from each error's linked docs page. - Runtime verification: Verifies each fix in a live 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, fixes sync-IO calls in shared layouts, then removes opt-outs one feature at a time until every route prerenders cleanly. ## Quick Start Enable Cache Components in my Next.js app and work through the blocking-prerender errors until the build passes.
