nuxt

Provide modular Nuxt 4+ guidance for server routes, routing, and configuration.

Updated Jun 22, 2024
One-click install
npx skills add https://github.com/Dyrean/dotfiles --skill nuxt-dyrean
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: nuxt
Source: https://github.com/Dyrean/dotfiles/tree/main/opencode/.config/opencode/skills/nuxt
Command: npx skills add https://github.com/Dyrean/dotfiles --skill nuxt-dyrean

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Nuxt 4+ projects come with a broad and evolving set of patterns (server routes, file-based routing, middleware, plugins, and configuration). This skill provides modular, on-demand guidance to help you adopt the latest Nuxt 4+ conventions without wading through unrelated files.

Core Features & Use Cases

  • Focused guidance for server routes, API endpoints, and server middleware in Nuxt 4+.
  • File-based routing, typed router usage, route groups, and definePage for advanced navigation.
  • Nuxt-specific features (auto-imports, modules, composables, and configuration patterns) with links to the latest docs.
  • Context-aware loading: read only the guidance relevant to your current task (server, routing, config, or composables).

Quick Start

Identify your current task (e.g., API routes, routing, or config) and read the corresponding guidance file (references/server.md, references/routing.md, references/nuxt-config.md) to load the needed patterns.

Frequently Asked Questions about nuxt

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up file-based routing and route groups in Nuxt 4?

File-based routing in Nuxt 4 uses directory structures to generate application routes automatically. You can organize related routes using route groups and configure advanced navigation through definePage and typed router usage.

What is the best way to create API endpoints and server middleware in Nuxt?

The best way to create API endpoints in Nuxt is using server routes within your project structure. You can implement server middleware to handle requests globally and apply context-aware patterns for your specific backend tasks.

How do Nuxt composables and auto-imports work across my project?

Nuxt composables provide reactive logic and state management that are automatically imported across your project components. This mechanism eliminates manual import statements and streamlines module integration and configuration patterns.

Does this Nuxt 4 guidance cover plugins and nuxt-config conventions?

Yes, this Nuxt 4 guidance covers plugins and nuxt-config conventions comprehensively. It provides modular, on-demand reference files for configuration patterns, plugins, and middleware so you only load what is needed for your current task.