NEXTJS_REQUIRE_EXPLICIT_DYNAMIC

For convenience, Next.js defaults to automatically selecting the rendering mode for pages and routes.

Whilst this works well, it also means that rendering modes can be changed unintentionally (i.e. through an update to a component that a page depends on). These changes can lead to unexpected behaviors, including performance issues.

To mitigate the chance that rendering modes change unexpectedly, you should explicitly set the dynamic route segment option to the desired mode. Note that the default value is auto, which will not satisfy this rule.

By default, this rule is disabled. To enable it, refer to customizing Conformance.

For further reading, see:

• Next.js File Conventions: Route Segment Config

This rule will catch any pages or routes that:

• Do not have the dynamic option set to a valid value.
• Have the dynamic option set to 'auto' (which is the default value).

In the following example, the page component does not have the dynamic route segment option set.

export default function Page() {
  // ...
}

The next example sets the dynamic route segment option, however it sets it to 'auto', which is already the default behavior and will not satisfy this rule.

export const dynamic = 'auto';
 
export default function Page() {
  // ...
}

If you see this issue in your codebase, you can resolve it by explicitly setting the dynamic route segment option for the page or route.

In this example, the dynamic route segment option is set to error, which forces the page to static, and will throw an error if any components use dynamic functions or uncached data.

export const dynamic = 'error';
 
export default function Page() {
  const text = 'Hello world';
  return <div>{text}</div>;
}