Stats
Actions
Tags
'%20stop-opacity%3D'0.16'%2F%3E%3Cstop%20offset%3D'1'%20stop-color%3D'rgb(200%2C90%2C60)'%20stop-opacity%3D'0.03'%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D'320'%20height%3D'200'%20fill%3D'url(%23g)'%2F%3E%3Ccircle%20cx%3D'250'%20cy%3D'56'%20r%3D'92'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.06'%2F%3E%3Ccircle%20cx%3D'64'%20cy%3D'172'%20r%3D'58'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.05'%2F%3E%3C%2Fsvg%3E)
From hairyf-skills-4
Vitesse-style Nuxt 4 starter with Vite, UnoCSS, Pinia, VueUse, and PWA. Scaffolds or maintains Nuxt apps using this opinionated stack.
How this skill is triggered — by the user, by Claude, or both
Slash command
/hairyf-skills-4:arch-nuxtThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
arch-nuxt is the **Vitesse-style starter for Nuxt 4**: SSR, file-based routing, auto-imports, and an opinionated stack (Vite, UnoCSS, Pinia, VueUse, ColorMode, VitePWA). It provides a minimal, production-ready setup: `app/` structure, layouts, composables, Pinia store with HMR, server API, PWA config, and UnoCSS. Prefer Vite-powered Nuxt; do not consider webpack or other bundlers.
GENERATION.mdreferences/best-practices-page-meta.mdreferences/best-practices-routing.mdreferences/core-app-structure.mdreferences/core-constants.mdreferences/core-eslint.mdreferences/core-nuxt-config.mdreferences/core-overview.mdreferences/core-scripts.mdreferences/features-client-only.mdreferences/features-color-mode.mdreferences/features-components.mdreferences/features-composables.mdreferences/features-data-fetching.mdreferences/features-layouts.mdreferences/features-pinia-state.mdreferences/features-pwa.mdreferences/features-server-api.mdreferences/features-unocss.mdarch-nuxt is the Vitesse-style starter for Nuxt 4: SSR, file-based routing, auto-imports, and an opinionated stack (Vite, UnoCSS, Pinia, VueUse, ColorMode, VitePWA). It provides a minimal, production-ready setup: app/ structure, layouts, composables, Pinia store with HMR, server API, PWA config, and UnoCSS. Prefer Vite-powered Nuxt; do not consider webpack or other bundlers.
The skill is based on vitesse-nuxt (arch-nuxt source), generated at 2026-01-30.
Recommended practices:
useState for SSR-shared state when appropriateapp/config/pwa.ts and spread it in nuxt.config.ts| Topic | Description | Reference |
|---|---|---|
| Overview | Project purpose, structure, stack, when to use | core-overview |
| Nuxt config | defineNuxtConfig, modules, app head, nitro, experimental | core-nuxt-config |
| App structure | app/, app.vue, NuxtLayout, NuxtPage | core-app-structure |
| Scripts | build, dev, generate, preview, typecheck, dev:pwa | core-scripts |
| Constants | app/constants, appName, appDescription | core-constants |
| ESLint | @antfu/eslint-config, Nuxt append | core-eslint |
| Topic | Description | Reference |
|---|---|---|
| Layouts | Layout system, definePageMeta layout | features-layouts |
| Composables | useCount, useState, auto-import | features-composables |
| Pinia state | useUserStore, defineStore, HMR | features-pinia-state |
| Server API | defineEventHandler, server/api | features-server-api |
| PWA | VitePWA config, manifest, workbox, dev PWA | features-pwa |
| UnoCSS | uno.config.ts, shortcuts, presets, icons | features-unocss |
| ColorMode | useColorMode, DarkToggle, theme-color meta | features-color-mode |
| Components | Auto-import, Counter, Footer, NuxtLink | features-components |
| Client-only | ClientOnly, Suspense, useOnline, fallback | features-client-only |
| Data fetching | useFetch, useTimeAgo, async component data | features-data-fetching |
| Topic | Description | Reference |
|---|---|---|
| Routing | File-based routing, dynamic/catch-all routes | best-practices-routing |
| Page meta | definePageMeta, layout selection | best-practices-page-meta |
npx claudepluginhub hairyf/skillsScans a codebase for architectural friction, presents candidates as a visual HTML report with before/after diagrams, and guides you through deepening refactors.