nuxt

Skill

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.

Files20
  • @skills/nuxt/GENERATION.md
  • @skills/nuxt/SKILL.md
  • @skills/nuxt/references/advanced-hooks.md
  • @skills/nuxt/references/advanced-layers.md
  • @skills/nuxt/references/advanced-module-authoring.md
  • @skills/nuxt/references/best-practices-data-fetching.md
  • @skills/nuxt/references/best-practices-ssr.md
  • @skills/nuxt/references/core-cli.md
  • @skills/nuxt/references/core-config.md
  • @skills/nuxt/references/core-data-fetching.md
  • @skills/nuxt/references/core-deployment.md
  • @skills/nuxt/references/core-directory-structure.md
  • @skills/nuxt/references/core-modules.md
  • @skills/nuxt/references/core-routing.md
  • @skills/nuxt/references/features-components-autoimport.md
  • @skills/nuxt/references/features-components.md
  • @skills/nuxt/references/features-composables.md
  • @skills/nuxt/references/features-server.md
  • @skills/nuxt/references/features-state.md
  • @skills/nuxt/references/rendering-modes.md
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 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 now point at app/; use ~~/@@ for the root.

Core

TopicDescriptionReference
Directory StructureNuxt 4 app/ srcDir, shared/, aliases, conventionscore-directory-structure [blocked]
Configurationnuxt.config.ts, app.config.ts, aliases, compatibilityVersion, experimentalcore-config [blocked]
CLI CommandsDev server, build, generate, preview, and utility commandscore-cli [blocked]
RoutingFile-based routing, dynamic routes, named views, layout props, middlewarecore-routing [blocked]
Data FetchinguseFetch, useAsyncData, $fetch, createUseFetch factories, cachingcore-data-fetching [blocked]
ModulesCreating and using Nuxt modules, Nuxt Kit utilitiescore-modules [blocked]
DeploymentPlatform-agnostic deployment with Nitro, Vercel, Netlify, Cloudflarecore-deployment [blocked]

Features

TopicDescriptionReference
Composables Auto-importsVue/Nuxt composables, custom composables, shared/, useAnnouncerfeatures-composables [blocked]
Components Auto-importsComponent naming, lazy loading, hydration strategiesfeatures-components-autoimport [blocked]
Built-in ComponentsNuxtLink, NuxtPage, NuxtLayout, NuxtAnnouncer, ClientOnly, and morefeatures-components [blocked]
State ManagementuseState composable, SSR-friendly state, Pinia integrationfeatures-state [blocked]
Server RoutesAPI routes, server middleware, Nitro server enginefeatures-server [blocked]

Rendering

TopicDescriptionReference
Rendering ModesUniversal (SSR), client-side (SPA), hybrid rendering, route rulesrendering-modes [blocked]

Best Practices

TopicDescriptionReference
Data Fetching PatternsEfficient fetching, caching, parallel requests, error handlingbest-practices-data-fetching [blocked]
SSR & HydrationAvoiding context leaks, hydration mismatches, composable patternsbest-practices-ssr [blocked]

Advanced

TopicDescriptionReference
LayersExtending applications with reusable layersadvanced-layers [blocked]
Lifecycle HooksBuild-time, runtime, and server hooksadvanced-hooks [blocked]
Module AuthoringPublishable modules with Nuxt Kit, keyed composables, dependenciesadvanced-module-authoring [blocked]
nuxt — Kortix Marketplace | Kortix