Index of every page on this site: llms.txt
All skills
antfu avatar

/nuxt

@7de210b official
by Anthony Fuantfu/skills6k stars
342
Run it yourself

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.

Use this Skill: https://skilld.dev/gh/antfu/skills/nuxt

Nothing lands on disk. Nothing to clean up.

Fork this Skill

Edit a local copy. It keeps the author and licence.

SKILL.md

≈44 tokens for metadata: the name and description. ≈1.1k when used: this file. ≈32k more on demand in 19 files.

Description uses 2.2% of example budget

Before choosing a Skill, your Agent reads its name and description. All available Skills share that space.

  • A shorter description leaves more room for other Skills. This entry exceeds our 1% size suggestion.

In our Claude Code example, all Skill names and descriptions share 8,000 characters. This Skill uses ≈175 characters, or 2.2%.

The 1% threshold is a size suggestion. Longer descriptions can still fit.

Your model, settings, and other Skills decide how much text your Agent can read.

Example settings and source

The example uses a 200k-token context and default Claude Code settings. The count includes the name, description, separators, and when_to_use when present. Codex also counts local file paths.

Skit's source and limits: Codex 0.160.1, Claude Code 2.1.292.

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 5.x (5.0.0-0), generated at 2026-09-25.

Directory layout: the default srcDir is app/ — Vue app code (app.vue, components/, composables/, pages/, etc.) lives under app/, while server/, shared/, public/, modules/, layers/ and nuxt.config.ts stay at the project root. The ~/@ aliases point at app/; use ~~/@@ for the root.

Nuxt 5 note: Nuxt 5 makes many former experimental flags the default. The biggest shifts for agents: server code moves to Nitro v3 (h3 v2, Web-standard Request/Response), server utilities import from nuxt/server and are no longer auto-imported by default, $fetch/useFetch are typed from generated route types, routing is case-sensitive and typed by default, and the bundler is Vite 8 (Rolldown). Nuxt 5 requires Node 22.19/24.11+. A Nitro v2 compatibility layer (nitroLegacy) keeps older server code building during migration. See individual references for details.

Core

Topic Description Reference
Directory Structure Nuxt 4 app/ srcDir, shared/, aliases, conventions core-directory-structure
Configuration nuxt.config.ts, app.config.ts, aliases, Nuxt 5 defaults, jiti removal, experimental core-config
CLI Commands Dev server, build, generate, preview, and utility commands core-cli
Routing File-based routing, case-sensitive + typed routes, named views, layout props, middleware core-routing
Data Fetching useFetch, useAsyncData, $fetch, typed routes, 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

Features

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, nuxt/server imports, Nitro v3 (h3 v2), sessions, middleware features-server

Rendering

Topic Description Reference
Rendering Modes Universal (SSR), client-side (SPA), hybrid rendering, route rules rendering-modes

Best Practices

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

Advanced

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

Source: SKILL.md on GitHub

Skill behaviors

No rule matched.

skilld matched fixed text patterns in SKILL.md and file names. Patterns miss obfuscated code.

skilld run checks every file with the same patterns. It asks for approval before it loads a Skill with a behavior marked Needs approval.

Third-party checks

No alerts3d5 checks · Risk SAFE
  • Gen Agent Trust Hub3d

    This skill is a collection of documentation and reference materials for the Nuxt framework (version 5). It contains technical guides on routing, configuration, data fetching, and deployment, intended to assist an AI agent in working with Nuxt projects. No security risks were identified.

  • Socket3d

    No alerts

  • Snyk3d

    Risk: LOW · No issues

  • Runlayer8mo

    3/20 files flagged

  • ZeroLeaks6mo

    Score: 93/100 · 2 sections analyzed

Provenance

Signed by skilld at 7de210b. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub last week.

Activeupdated last month

Capability

Other metadata
metadata
{
  "author": "Anthony Fu",
  "version": "2026.9.25",
  "source": "Generated from https://github.com/nuxt/nuxt, scripts located at https://github.com/antfu/skills"
}

Topics

  • Nuxt
  • Vue
  • ssr
  • full-stack
  • file-based-routing
  • nitro
  • auto-imports
  • server-routes
  • composables
  • state-management

README badge

README badge for antfu/skills/nuxt

What it does

This skill provides comprehensive guidance on Nuxt 3, a full-stack Vue framework with server-side rendering, file-based routing, auto-imports, and Nitro-powered server deployment. It covers directory structure, configuration, routing, data fetching, state management, server routes, rendering modes, and module authoring across core, feature, and advanced sections.

Generated from the current SKILL.md.

Frequently asked

Does this skill cover Nuxt 2?
No. This skill is based on Nuxt 3.x, generated at 2026-01-28.
What server runtime does Nuxt use?
Nuxt uses Nitro as its server engine, which supports universal deployment across Node.js, serverless, and edge platforms.
Does this skill cover server routes and API endpoints?
Yes. The skill includes guidance on server routes, API routes, server middleware, and the Nitro server engine.
What rendering modes are supported?
The skill covers universal (SSR), client-side (SPA), hybrid rendering, and route rules for controlling how pages are rendered.
Does this skill explain state management?
Yes. It covers the useState composable, SSR-friendly state patterns, and Pinia integration.

Generated from the current SKILL.md. These answers refresh after source changes.