skills.rest
reqcore-inc
reqcore-incOFFICIAL
Explore all skills by this author →
WebsiteGitHub

nuxt-4-skill

Enforce Nuxt 4 coding practices and migrate away from Nuxt 3 patterns.

13|10|Updated Feb 14, 2026
Search Tags:#architecture#frontend#vue#nuxt#nuxt4
One-click install
npx skills add https://github.com/reqcore-inc/reqcore --skill nuxt-4-skill
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: nuxt-4-skill
Source: https://github.com/reqcore-inc/reqcore/tree/main/.agents/skills/nuxt-4-skill
Command: npx skills add https://github.com/reqcore-inc/reqcore --skill nuxt-4-skill

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Nuxt 4 projects often risk legacy Nuxt 3 patterns and architectural drift. This skill guides AI agents to write correct, modern Nuxt 4 code, preventing outdated practices and improving maintainability.

Core Features & Use Cases

  • Enforces Nuxt 4 project structure with app/ at the root and proper separation of server and client contexts.
  • Guides on data fetching, routing, and configuration aligned with Nuxt 4: useFetch/useAsyncData, nitro prerender, and route rules.
  • Use Case: When starting a new Nuxt 4 project or migrating from Nuxt 3, generate compliant scaffolding and guardrails to avoid common migration mistakes.

Quick Start

Instruct the agent to implement Nuxt 4 compliant code using the app/ directory and Nuxt 4 conventions.

Frequently Asked Questions about nuxt-4-skill

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

FAQPage Schema
How do I structure a new Nuxt 4 project to ensure correct architecture?▼

To structure a Nuxt 4 project correctly, place your application code in the root app/ directory and ensure proper separation of server and client contexts. This enforces modern Nuxt 4 conventions and improves maintainability.

What's the best way to migrate from Nuxt 3 to Nuxt 4 without architectural drift?▼

Migrating from Nuxt 3 to Nuxt 4 requires applying updated conventions like the app/ directory, Unhead v2, and nitro prerender. Enforcing these Nuxt 4 patterns prevents outdated practices and avoids common migration mistakes.

How do useFetch and useAsyncData work in Nuxt 4 data fetching?▼

In Nuxt 4, useFetch and useAsyncData are the standard patterns for data fetching. Following Nuxt 4 compliant useFetch and useAsyncData patterns ensures correct data retrieval and prevents legacy architectural drift.

Does Nuxt 4 require specific route rules and nitro prerender configuration?▼

Nuxt 4 requires proper configuration of route rules and nitro prerender for routing and rendering. Applying these Nuxt 4 conventions ensures compliant application structure and prevents outdated Nuxt 3 patterns.

Why does my Nuxt 4 code keep using outdated Nuxt 3 patterns?▼

Nuxt 4 code often risks legacy Nuxt 3 patterns and architectural drift without proper guardrails. Enforcing correct Nuxt 4 coding practices, such as app/ directory usage and Unhead v2, prevents outdated practices.

Can I use Nuxt 3 directory structures in a Nuxt 4 migration?▼

No, Nuxt 4 migrations require moving to the root app/ directory structure. Enforcing correct Nuxt 4 project structure with app/ at the root and proper context separation prevents outdated Nuxt 3 patterns.

Related Skills

Explore More Software Engineering Skills→
iamcapoteiamcapote

setup-stellar-contracts

Automate Stellar Soroban contract setup with Rust toolchains and OpenZeppelin crates.

Community
Advanced
riftzen-bitriftzen-bit

nuxt4-patterns

Diagnose hydration mismatches and SSR errors in Nuxt 4 applications.

Community
Advanced
antfuantfu
5.7k

nuxt

Build full-stack Vue applications with SSR and file-based routing.

Community
Advanced
jcsoftdevjcsoftdev

progressive-hydration

Implements progressive hydration for SSR React apps using Suspense and code-splitting.

Community
Advanced