6527d29c8a
Now that we've improved `/messages` (https://github.com/vercel/next.js/pull/52038), we'd like to start updating some of the content as well 🙏
23 lines
1.7 KiB
Text
23 lines
1.7 KiB
Text
---
|
|
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/static-and-dynamic-rendering) - Learn more about the differences between static and dynamic rendering in Next.js.
|
|
- [Dynamic Functions](/docs/app/building-your-application/data-fetching/fetching#server-component-functions) - Understand more about the usage of dynamic server functions in your Next.js application.
|