Agent skill · software engineering · secondsky
nuxt-production
| Nuxt 5 production optimization: hydration, performance, testing with Vitest, deployment to Cloudflare/Vercel/Netlify, and migration from Nuxt 4. Use when: debugging hydration mismatches, optimizing performance and Core Web Vitals, writing tests with Vitest, deploying to Cloudflare Pages/Workers/Vercel/Netlify, or migrating from Nuxt 4 to Nuxt 5.
Why this skill is useful
Provides specific patterns and commands for optimizing Nuxt 5 applications that the AI wouldn't reliably generate on its own.
What it needs
Requires vite installed locally. About 6k tokens when loaded. Last updated 2026-08-06. 204 stars on the source repository.
What this skill does
Nuxt 5 Production Guide Hydration, performance, testing, deployment, and migration patterns. What's New in Nuxt 5 v5 Key Changes Change Nuxt 4 Nuxt 5 -------- -------- -------- Bundler Vite 6 (esbuild + Rollup) Vite 8 (Rolldown) Server engine Nitro v2 Nitro v3 (h3 v2) Server errors createError({statusCode}) HTTPError({status}) Client-only placeholder Empty <div> HTML comment node callHook Always returns Promise May return void clearNuxtState Sets to undefined Resets to initial default Page names Auto-generated Normalized to route names JSX support Included by default Optional (on-demand) externalVue Configurable Removed (always mocked) Client-Only Comment Placeholders (v5) Client-only components (.client.vue files and createClientOnly() wrappers) now render an HTML comment on the server instead of an empty <div>. This fixes scoped styles hydration issues. To revert to the old <div> behavior: Non-Async callHook (v5) callHook may now return void instead of always returning Promise. Always use await: When to Load References Load references/hydration.md when: Debugging "Hydration node mismatch" errors Implementing ClientOnly components Fixing non-deterministic rendering issues Load references/performance.md when: Optimizing Core Web Vitals scores Implementing lazy loading and code splitting Reducing bundle size Load references/testing-vitest.md when: Writing component tests with @nuxt/test-utils Testing composables with Nuxt context Mocking Nuxt APIs Load references/deployment-cloudflare.md when: Deploying to Cloudflare Pages or Workers Configuring wrangler.toml Setting up NuxtHub integration Hydration Best Practices What Causes Hydration Mismatches Cause Example Fix ------- --------- ----- Non-deterministic values Math.random() Use useState Browser APIs on server window.innerWidth Use onMounted Date/time on server new Date() Use useState or ClientOnly Third-party scripts Analytics Use ClientOnly Fix Patterns Performance Optimization Lazy Loading Components Lazy Hydrati …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills secondsky/nuxt-production--36c5cc