Provide Nuxt 3+ development guidance for .vue and .ts files.
npx skills add https://github.com/lttr/claude-marketplace --skill nuxt
Please help me install this Agent Skill. Skill: nuxt Source: https://github.com/lttr/claude-marketplace/tree/main/plugins/nuxt/skills/nuxt Command: npx skills add https://github.com/lttr/claude-marketplace --skill nuxt
Nuxt development involves complex configurations, specific conventions, and keeping up with a rapidly evolving ecosystem (Vue, Nuxt 3/4, modules, SSR/SSG patterns). This skill centralizes best practices, module knowledge, and quick references, reducing the cognitive load and time spent searching documentation.
useFetch, and how to structure their composables and server routes, without leaving their IDE or manually sifting through documentation.Help me set up a new Nuxt 4 project with Tailwind CSS and Nuxt UI. Provide the nuxt.config.ts and app.vue configurations.
High-intent search queries and answers about installing and using this skill.
Nuxt 3 supports SSR (server-side rendering) and SSG (static site generation) through the nitro preset configuration in nuxt.config.ts. Set preset to 'node-server' for SSR or 'static' for SSG, then configure your build output. SSR renders pages server-side on each request, while SSG pre-generates static HTML at build time for faster performance.
Place composables in the composables/ directory for client-side logic and reusable Vue hooks; Nuxt auto-imports them. Server routes go in server/routes/ or server/api/ for API endpoints. Use server/ middleware for request validation and authentication. This structure leverages Nuxt's file-based routing and enables SSR-compatible data fetching with useFetch().
Nuxt 3+ auto-configures TypeScript via nuxt.config.ts and auto-imports components, composables, and utilities from designated directories. Define custom auto-imports in nuxt.config.ts using the imports property. Enable strict type checking in tsconfig.json. Auto-imports reduce boilerplate and improve IDE support across .vue and .ts files.
Yes. Nuxt UI is built on Headless UI and Tailwind CSS and installs as a module via package.json. Add @nuxt/ui to buildModules in nuxt.config.ts (or modules in Nuxt 4). Tailwind is auto-configured; Nuxt UI provides pre-built, accessible components styled with Tailwind utility classes without manual CSS.
Use useFetch() or useAsyncData() composables for SSR-compatible data fetching; they run on server and client. Place fetch calls in components or plugins to leverage Nuxt's hydration. Avoid browser-only APIs in setup(). Server routes handle backend logic; call them via useFetch() to keep data loading unified and SSR-safe.
Nuxt automatically generates routes from .vue files in the pages/ directory. Nested folders create nested routes; [id].vue files create dynamic segments. pages/index.vue becomes /, pages/about.vue becomes /about, pages/posts/[id].vue becomes /posts/:id. Middleware and layouts auto-apply based on directory structure and naming conventions.
AloisHBuild full-stack Vue applications with Nuxt SSR, routing, and server support.
ChrisTowlesImplement Nuxt 4 SSR patterns with composables, server routes, and Cloudflare deployment.
tankpkgStandardize Vue 3 and Nuxt 3 production application patterns.
RepairYourTechCreate full-stack Vue.js applications with Nuxt.js file-based routing and Nitro server routes.