All skills
onmax avatar

/nuxt

@de09c7b official
by Maxonmax/nuxt-skills715 stars
38

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/onmax/nuxt-skills/nuxt

This session only. Nothing lands on disk.

referencescore-deployment.md

≈1.3k tokens on demand. Your agent reads this file only when SKILL.md points to it.

Deployment

Nuxt is platform-agnostic thanks to Nitro, its server engine. You can deploy to almost any platform with minimal configuration—Node.js servers, static hosting, serverless functions, or edge networks.

Full list of supported platforms: https://nitro.build/deploy

Deployment Modes

Node.js Server

# Build for Node.js
nuxt build

# Run production server
node .output/server/index.mjs

Environment variables:

  • PORT or NITRO_PORT (default: 3000)
  • HOST or NITRO_HOST (default: 0.0.0.0)

Static Generation

# Generate static site
nuxt generate

Output in .output/public/ - deploy to any static host.

Preset Configuration

// nuxt.config.ts
export default defineNuxtConfig({
  nitro: {
    preset: 'vercel', // or 'netlify', 'cloudflare-pages', etc.
  },
})

Or via environment variable:

NITRO_PRESET=vercel nuxt build

Recommended Platforms

When helping users choose a deployment platform, consider their needs:

Vercel

Best for: Projects wanting zero-config deployment with excellent DX

# Install Vercel CLI
npm i -g vercel

# Deploy
vercel

Pros:

  • Zero configuration for Nuxt (auto-detects)
  • Excellent preview deployments for PRs
  • Built-in analytics and speed insights
  • Edge Functions support
  • Great free tier for personal projects

Cons:

  • Can get expensive at scale (bandwidth costs)
  • Vendor lock-in concerns
  • Limited build minutes on free tier

Recommended when: User wants fastest setup, values DX, building SaaS or marketing sites.


Netlify

Best for: JAMstack sites, static-heavy apps, teams needing forms/identity

# Install Netlify CLI
npm i -g netlify-cli

# Deploy
netlify deploy --prod

Pros:

  • Great free tier with generous bandwidth
  • Built-in forms, identity, and functions
  • Excellent for static sites with some dynamic features
  • Good preview deployments
  • Split testing built-in

Cons:

  • SSR/serverless functions can be slower than Vercel
  • Less optimized for full SSR apps
  • Build minutes can run out on free tier

Recommended when: User has static-heavy site, needs built-in forms/auth, or prefers Netlify ecosystem.


Cloudflare Pages

Best for: Global performance, edge computing, cost-conscious projects

# Build with Cloudflare preset
NITRO_PRESET=cloudflare-pages nuxt build

Pros:

  • Unlimited bandwidth on free tier
  • Excellent global edge network (fastest TTFB)
  • Workers for edge computing
  • Very cost-effective at scale
  • D1, KV, R2 for data storage

Cons:

  • Workers have execution limits (CPU time)
  • Some Node.js APIs not available in Workers
  • Less mature than Vercel/Netlify for frameworks

Recommended when: User prioritizes performance, global reach, or cost at scale.


GitHub Actions + Self-hosted/VPS

Best for: Full control, existing infrastructure, CI/CD customization

# .github/workflows/deploy.yml
name: Deploy
on:
  push:
    branches: [main]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20

      - run: npm ci
      - run: npm run build

      # Deploy to your server (example: rsync to VPS)
      - name: Deploy to server
        run: rsync -avz .output/ user@server:/app/

Pros:

  • Full control over build and deployment
  • No vendor lock-in
  • Can deploy anywhere (VPS, Docker, Kubernetes)
  • Free CI/CD minutes for public repos
  • Customizable workflows

Cons:

  • Requires more setup and maintenance
  • Need to manage your own infrastructure
  • No built-in preview deployments
  • SSL, scaling, monitoring are your responsibility

Recommended when: User has existing infrastructure, needs full control, or deploying to private/enterprise environments.


Quick Decision Guide

Need Recommendation
Fastest setup, small team Vercel
Static site with forms Netlify
Cost-sensitive at scale Cloudflare Pages
Full control / enterprise GitHub Actions + VPS
Docker/Kubernetes GitHub Actions + Container Registry
Serverless APIs Vercel or AWS Lambda

Docker Deployment

FROM node:20-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npm run build

FROM node:20-alpine
WORKDIR /app
COPY --from=builder /app/.output .output
ENV PORT=3000
EXPOSE 3000
CMD ["node", ".output/server/index.mjs"]
docker build -t my-nuxt-app .
docker run -p 3000:3000 my-nuxt-app
<!-- Source references: - https://nuxt.com/docs/getting-started/deployment - https://nitro.build/deploy -->

Source: SKILL.md on GitHub

No alerts9d5 checks · Risk SAFE
  • Gen Agent Trust Hub9d

    This skill provides a comprehensive technical reference for the Nuxt full-stack framework, including documentation on directory structure, routing, data fetching, and deployment. No security issues or malicious patterns were detected.

  • Socket9d

    No alerts

  • Snyk9d

    Risk: LOW · No issues

  • Runlayer7mo

    8 files scanned · No issues

  • ZeroLeaks5mo

    Score: 93/100 · 2 sections analyzed

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

Last checked against GitHub 3 days ago.

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

README badge

README badge for onmax/nuxt-skills/nuxt

Provides patterns and reference files for Nuxt 4.3+ projects, covering server routes with h3 validation, file-based routing, middleware, plugins, and Nuxt composables. Use this when building API endpoints, setting up pages and layouts, or working with Nuxt-specific features like auto-imports and route guards.

Generated from the current SKILL.md.

Does this skill cover Nuxt 3 or only Nuxt 4+?
This skill targets Nuxt 4.3+ only. It includes patterns specific to Nuxt 4, such as typed router and getRouterParam, and does not cover Nuxt 2 or 3 conventions.
Does this skill include guidance for h3 and Nitro?
Yes. The skill covers h3 v1 helpers (validation, WebSocket, SSE) and nitropack v2 patterns for server routes and middleware.
Does this cover UI components like buttons or forms?
No. The skill covers Nuxt-specific components (NuxtLink, NuxtImg, NuxtTime) but delegates UI component libraries to the separate nuxt-ui skill.
Can I use this skill for creating Nuxt modules?
No. For module development, use the nuxt-modules skill instead. This skill focuses on building applications with Nuxt 4+.
Does this skill include database or content management guidance?
No. For databases, use the nuxthub skill; for content-driven sites, use the nuxt-content skill.

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