Framework full-stack Vue con SSR, auto-imports y routing basado en archivos. Úsalo para apps Nuxt, server routes, useFetch, middleware o hybrid rendering.
en todo el repo
0–100, la ruta de este skill
último commit aquí
últimos 90 días
42 tok en reposo
115 KB
Funciona con cualquier agente que lea SKILL.md
npx -y skills add antfu/skills --skill nuxt --agent claude-codeSe instala solo en este repositorio.
Di cualquiera de estas frases y el agente debería cargar este skill.
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 |
| Configuration | nuxt.config.ts, app.config.ts, aliases, compatibilityVersion, experimental | core-config |
| CLI Commands | Dev server, build, generate, preview, and utility commands | core-cli |
| Routing | File-based routing, dynamic routes, named views, layout props, middleware | core-routing |
| Data Fetching | useFetch, useAsyncData, $fetch, createUseFetch factories, caching | core-data-fetching |
| Modules | Creating and using Nuxt modules, Nuxt Kit utilities | core-modules |
| Deployment | Platform-agnostic deployment with Nitro, Vercel, Netlify, Cloudflare | core-deployment |
| Topic | Description | Reference |
|---|---|---|
| Composables Auto-imports | Vue/Nuxt composables, custom composables, shared/, useAnnouncer |
features-composables |
| Components Auto-imports | Component naming, lazy loading, hydration strategies | features-components-autoimport |
| Built-in Components | NuxtLink, NuxtPage, NuxtLayout, NuxtAnnouncer, ClientOnly, and more | features-components |
| State Management | useState composable, SSR-friendly state, Pinia integration | features-state |
| Server Routes | API routes, server middleware, Nitro server engine | features-server |
| Topic | Description | Reference |
|---|---|---|
| Rendering Modes | Universal (SSR), client-side (SPA), hybrid rendering, route rules | rendering-modes |
| Topic | Description | Reference |
|---|---|---|
| Data Fetching Patterns | Efficient fetching, caching, parallel requests, error handling | best-practices-data-fetching |
| SSR & Hydration | Avoiding context leaks, hydration mismatches, composable patterns | best-practices-ssr |
| Topic | Description | Reference |
|---|---|---|
| Layers | Extending applications with reusable layers | advanced-layers |
| Lifecycle Hooks | Build-time, runtime, and server hooks | advanced-hooks |
| Module Authoring | Publishable modules with Nuxt Kit, keyed composables, dependencies | advanced-module-authoring |
Reproducido de antfu/skills bajo licencia MIT. Leer esta página en markdown.
20 archivos en el paquete. Solo se lee SKILL.md al activarse — las referencias se cargan si el skill decide que las necesita.
Pensado para proyectos basados en Nuxt 4.x con srcDir app/.
Este repo incluye 19 skills. Si instalas uno, normalmente ya tienes los demás. Ver el pack skills entero y su comando de instalación
Herramientas y convenciones de Anthony Fu para proyectos JavaScript/TypeScript: configuración de ESLint, monorepos y publicación de librerías.
Convenciones de diseño estilo antfu: tokens semánticos basados en clases con UnoCSS para light/dark, más reglas anti-slop y de micro-interacción para devtools y landing pages.
Nitro es el toolkit de servidor agnóstico de framework (usado por Nuxt) para construir y desplegar servidores web en cualquier lugar: routing, config, caching, tasks, websockets y despliegue en Node/Bun/Deno/Cloudflare/Vercel.
Gestor de paquetes de Node.js con resolución estricta de dependencias. Úsalo para comandos de pnpm, pnpm-workspace.yaml, catalogs, patches, overrides, config dependencies o el global virtual store.
Crea y presenta slidedecks web para desarrolladores con Slidev, usando Markdown, componentes Vue, resaltado de código, animaciones y funciones interactivas.
Empaqueta librerías TypeScript y JavaScript a gran velocidad usando Rolldown. Útil al construir librerías, generar declaraciones de tipos, bundlear en múltiples formatos o migrar desde tsup.
Optimiza la configuración del contexto del agente. Úsalo al iniciar una sesión nueva, cuando la calidad del agente empeora, al cambiar de tarea o al configurar archivos de reglas y contexto de un proyecto.
Gestiona la baja y migración de sistemas: retirar APIs o funciones antiguas, migrar usuarios a una nueva implementación, migrar un esquema de BD en producción (expand/contract) sin downtime, o decidir si mantener o retirar código.
Estructura las prácticas de flujo de trabajo en git: commits, ramas, resolver conflictos, dividir trabajo sin confirmar en commits atómicos, PRs, push, trabajo en paralelo, releases, versión semántica, tags y changelog.
