Route segment config "dynamic" is not compatible with nextConfig.cacheComponents

Checklist

Replace each rejected export, then rebuild

1. 01
   List every rejected export in the app. The check runs on page, layout and route files and on metadata files (icon, opengraph-image, sitemap, robots, manifest), and each file gets its own error:

   grep -rnE "export const (dynamic|dynamicParams|revalidate|fetchCache|runtime|experimental_ppr)\b" app src/app 2>/dev/null

2. 02
   For dynamic = 'force-dynamic' (or revalidate = 0), delete the line. If the file reads cookies(), headers(), searchParams or an uncached fetch at the top, move that read into a child component inside <Suspense>, so the rest of the page prerenders and that part streams in at request time:

   // Before: app/dashboard/page.tsx
   import { cookies } from 'next/headers'
   
   export const dynamic = 'force-dynamic'
   
   export default async function Page() {
     const theme = (await cookies()).get('theme')?.value
     return <Dashboard theme={theme} />
   }
   
   // After
   import { Suspense } from 'react'
   import { cookies } from 'next/headers'
   
   export default function Page() {
     return (
       <Suspense fallback={<p>Loading...</p>}>
         <Dashboard />
       </Suspense>
     )
   }
   
   async function Dashboard() {
     const theme = (await cookies()).get('theme')?.value
     // ...
   }

3. 03If the route has no useful static part, such as a page that checks the session in its layout before rendering anything, you can instead add export const instant = false to that page or layout. It lets the segment block on request-time data; it does not turn off prerendering, and the Next.js docs ask you to prefer <Suspense> where you can.
4. 04
   For dynamic = 'force-static' or a revalidate number, delete the line, put "use cache" in the page or in a data function, and set the lifetime with cacheLife ('seconds', 'minutes', 'hours', 'days', 'weeks' or 'max'). Tags from fetch next.tags move to cacheTag, and revalidateTag now takes a profile as its second argument:

   // Before
   export const revalidate = 3600
   
   export default async function Page() {
     const posts = await fetch('https://api.example.com/posts').then((res) => res.json())
     return <PostList posts={posts} />
   }
   
   // After
   import { cacheLife, cacheTag } from 'next/cache'
   
   export default async function Page() {
     'use cache'
     cacheLife('hours')
     cacheTag('posts')
     const posts = await fetch('https://api.example.com/posts').then((res) => res.json())
     return <PostList posts={posts} />
   }
   
   // In a Route Handler or webhook: revalidateTag('posts', 'max')

5. 05force-static also made cookies() and headers() return empty values. Without it they return the real request values, so remove those reads from a route that must stay prerendered. On Next.js 16.4 and later, export const ensureStatic = 'navigation' fails the build if request-time work gets into that route again.
6. 06For fetchCache, delete the line. With 'force-cache', 'default-cache' or 'only-cache', wrap the data that should stay cached in "use cache"; with the no-store values, leave the data outside any cache scope, since fetches are uncached by default under Cache Components.
7. 07For dynamicParams, delete the line; if it was false, call notFound() when a param does not match real data. generateStaticParams must return at least one param under Cache Components. For runtime, delete the line even when it says 'nodejs', because Cache Components requires the Node.js runtime; move edge-only logic to proxy.
8. 08Run next build again. Removing force-dynamic often leads to the next error, a page that reads cookies(), headers() or searchParams outside <Suspense>; next build --debug-prerender prints the file and line.

Related

Related guides

• Next.js "Uncached data was accessed outside of <Suspense>": why new apps hit it, and the fixGuide
• useSearchParams() should be wrapped in a suspense boundary at page "/..."Guide
• Failed to collect page data forGuide

Sources

Official docs behind this checklist

• Next.js, Migrating to Cache Components
• Next.js, cacheComponents config
• Next.js, Route Segment Config
• Next.js, How to upgrade to version 16
• Next.js 16.4 release post
• vercel/next.js, the build check that emits the error

FAQ

FAQ for builders before launch