Files
next.js/errors/app-static-to-dynamic-error.mdx
T
2f6054f419 Docs: RC Updates (#70031)
**Do not merge.**

- [x] `staticgeneration*` options
- [x] `next/form` now available in pages, `prefetch` prop added to app 
- [x]  ~`next/after` stable~ reverted changes
- [x]  `instrumentation.js` stable
- [x]  More secure server actions
- [x]  Update turbopack docs
    - [x]  https://nextjs.org/docs/architecture/turbopack
- [x] https://nextjs.org/docs/app/api-reference/next-config-js/turbo
    - [x]  Move `turbo` config option out of experimental
- [x]  Document `connection()`
- [x] De-prioritize `unstable_noStore` - add note about using
`connection()`
    - [x]  Replace examples of `noStore` with `connection`
- [x]  Async APIs
    - [x]  Reference Pages
        - [x]  `cookies`
        - [x]  `headers`
        - [x]  `draftMode`
        - [x]  `page.js` (`searchParams` and `params` prop)
        - [x]  `layout.js` (`params` prop)
        - [x]  `route.js` (`params` prop)
        - [x]  `default.js` (`params` prop)
- [x] Clarify `use` usage
https://vercel.slack.com/archives/C06N3AXRQ82/p1726483924090979?thread_ts=1726250070.321229&cid=C06N3AXRQ82
    - [x]  Update **examples** throughout the docs:
        - [x]  `cookies`
        - [x]  `headers`
        - [x]  `draftMode`
        - [x]  `searchParams`
        - [x]  `params`
- [x] Update Dynamic API section in the Server Components Page:
https://nextjs.org/docs/app/building-your-application/rendering/server-components#dynamic-rendering
- [x] Update Dynamic API mentions in Route Handler page:
https://nextjs.org/docs/app/building-your-application/routing/route-handlers#dynamic-functions
- [x] Update upgrade guide for Next 15 RC:
https://nextjs.org/docs/app/building-your-application/upgrading/version-15
- [x] Document codemods for async APIs. PR:
https://github.com/vercel/next.js/pull/69572
- [x] Document geo codemod. Done here:
https://github.com/vercel/next.js/pull/70064

Closes: https://linear.app/vercel/issue/DOC-3018/nextjs-15-rc-2

---------

Co-authored-by: Rich Haines <[email protected]>
Co-authored-by: Ahmed Abdelbaset <[email protected]>
Co-authored-by: Nikhil S <[email protected]>
2024-10-14 11:41:49 +01:00

24 lines
1.7 KiB
Plaintext

---
title: Resolving "app/ Static to Dynamic Error" in Next.js
description: This document explains the "app/ Static to Dynamic Error" in Next.js and provides potential solutions to resolve it.
---
## Why This Error Occurred
The "`app/` Static to Dynamic Error" happens when one of your routes in the `app/` directory is initially generated statically at build time, but during runtime it attempts to use dynamic server values (such as `cookies` or `headers`) either for a fallback path or while a path is being revalidated.
Currently, Next.js does not support switching between static and dynamic types during runtime, so the system throws an error.
## Possible Ways to Fix It
To resolve this issue, you have two main options:
1. Prevent the conditional use of dynamic server values that may cause the static/dynamic mode of the page to differ between build time and runtime. This ensures consistency in the rendering mode of your page.
2. Leverage the `dynamic` export to control the handling of your page. If you want to ensure your page is always handled statically, regardless of the usage of dynamic server values, you can use `export const dynamic = 'force-static'`. Conversely, if you prefer your page to always be dynamic, you can use `export const dynamic = 'force-dynamic'`, and your page won't attempt to be statically generated.
## Useful Links
- [Static and Dynamic Rendering](/docs/app/building-your-application/rendering/server-components#server-rendering-strategies) - Learn more about the differences between static and dynamic rendering in Next.js.
- [Dynamic APIs](/docs/app/building-your-application/rendering/server-components#dynamic-apis) - Understand more about the usage of dynamic server functions in your Next.js application.