Nuxt 4 Patterns

Nuxt 3 EOL: July 31, 2026. Migrate to Nuxt 4 before that date to continue receiving security patches.

Use when building or debugging Nuxt 4 apps with SSR, hybrid rendering, route rules, or page-level data fetching.

When to Activate

• Hydration mismatches between server HTML and client state
• Route-level rendering decisions such as prerender, SWR, ISR, or client-only sections
• Performance work around lazy loading, lazy hydration, or payload size
• Page or component data fetching with useFetch, useAsyncData, or $fetch
• Nuxt routing issues tied to route params, middleware, or SSR/client differences

Directory Structure (Nuxt 4 app/ convention)

Nuxt 4 moves application source into an app/ directory, cleanly separating app code from project config: