Setting the skill. One moment.
Skills
Skill 4 of 19
Nuxt full-stack Vue framework with SSR, auto-imports, and file-based routing.
1 minute · 265 words · 5 sections
Install
npx skills add antfu/skills --skill nuxtnpx skills add antfu/skillsThe first command installs just this skill, by the name in its SKILL.md; the second installs the whole repository.
Nuxt is a full-stack Vue framework that provides server-side rendering, file-based routing, auto-imports, and a powerful module system. It uses Nitro as its server engine for universal deployment across Node.js, serverless, and edge platforms.
The skill is based on Nuxt 4.x, generated at 2026-06-22.
Nuxt 4 note: the default
srcDirisapp/— Vue app code (app.vue,components/,composables/,pages/, etc.) lives underapp/, whileserver/,shared/,public/,modules/,layers/andnuxt.config.tsstay at the project root. The~/@aliases now point atapp/; use~~/@@for the root.
| Topic | Description | Reference |
|---|---|---|
| Directory Structure | Nuxt 4 app/ srcDir, shared/, aliases, conventions | core-directory-structure (opens in a new tab) |
| Configuration | nuxt.config.ts, app.config.ts, aliases, compatibilityVersion, experimental | core-config (opens in a new tab) |
| CLI Commands | Dev server, build, generate, preview, and utility commands | core-cli (opens in a new tab) |
| Routing | File-based routing, dynamic routes, named views, layout props, middleware | core-routing (opens in a new tab) |
| Data Fetching | useFetch, useAsyncData, $fetch, createUseFetch factories, caching | core-data-fetching (opens in a new tab) |
| Modules | Creating and using Nuxt modules, Nuxt Kit utilities | core-modules (opens in a new tab) |
| Deployment | Platform-agnostic deployment with Nitro, Vercel, Netlify, Cloudflare | core-deployment (opens in a new tab) |
| Topic | Description | Reference |
|---|---|---|
| Composables Auto-imports | Vue/Nuxt composables, custom composables, shared/, useAnnouncer | features-composables (opens in a new tab) |
| Components Auto-imports | Component naming, lazy loading, hydration strategies | features-components-autoimport (opens in a new tab) |
| Built-in Components | NuxtLink, NuxtPage, NuxtLayout, NuxtAnnouncer, ClientOnly, and more | features-components (opens in a new tab) |
| State Management | useState composable, SSR-friendly state, Pinia integration | features-state (opens in a new tab) |
| Server Routes | API routes, server middleware, Nitro server engine | features-server (opens in a new tab) |
| Topic | Description | Reference |
|---|---|---|
| Rendering Modes | Universal (SSR), client-side (SPA), hybrid rendering, route rules | rendering-modes (opens in a new tab) |
| Topic | Description | Reference |
|---|---|---|
| Data Fetching Patterns | Efficient fetching, caching, parallel requests, error handling | best-practices-data-fetching (opens in a new tab) |
| SSR & Hydration | Avoiding context leaks, hydration mismatches, composable patterns | best-practices-ssr (opens in a new tab) |
| Topic | Description | Reference |
|---|---|---|
| Layers | Extending applications with reusable layers | advanced-layers (opens in a new tab) |
| Lifecycle Hooks | Build-time, runtime, and server hooks | advanced-hooks (opens in a new tab) |
| Module Authoring | Publishable modules with Nuxt Kit, keyed composables, dependencies | advanced-module-authoring (opens in a new tab) |
Nuxt full-stack Vue framework with SSR, auto-imports, and file-based routing. Use when working with Nuxt apps, server routes, useFetch, middleware, or hybrid rendering.
The verbatim description from this skill’s front matter — the string an agent matches on to decide whether to load it.
main, last pushed 23 June 2026.SKILL.md, not by matching a directory convention. One layout observed: skills/*/SKILL.md./antfu/skills.md, and each skill at its own .md URL.19 files · 111 KB
Everything this skill ships beside its prose. All of it is set here, as subchapters of skill 4.
Documentation the agent loads on demand, rather than up front.
Everything else published alongside the skill.