Guidelines for AI Assistants

Leverage the full power of Nuxt UI in your AI-powered workflow. These guidelines are designed to help AI coding assistants like Cursor, Windsurf, Claude Code, and others understand the best practices for working with the Nuxt UI component library.

Available Rule Sets

We provide two versions of Nuxt UI rules to fit different needs:

📚 Complete Rules (nuxt-ui.md) - Recommendedundefined

• undefined~600 lines - Comprehensive documentation and examples
• undefinedDetailed breaking changes - Full v2 → v3 migration guide
• undefinedAdvanced patterns - Theming, performance, accessibility, TypeScript
• undefinedBest for most projects and learningundefined

📋 Minimal Rules (nuxt-ui-minimal.md)

• undefined~140 lines - Optimized for AI assistants with token limits
• undefinedEssential changes only - Core breaking changes and patterns
• undefinedQuick reference - Most common pitfalls to avoid
• undefinedFor AI assistants with limited contextundefined

Getting Started

undefinedRecommended → Use the complete rules

undefinedFor AI assistants with limited context → Use the minimal rules

Using with Cursor

undefinedOption 1 - Via Settings Interface (Recommended) 🎯

1. Open Cursor Settings (Cmd/Ctrl + ,)
2. Navigate to “Rules for AI” tab
3. Copy and paste your chosen rule content:
   • undefinedComplete: Copy from nuxt-ui.md
   • undefinedMinimal: Copy from nuxt-ui-minimal.md

undefinedOption 2 - Via File Configurationundefined

1. Create .cursor/rules/nuxt-ui.mdc in your project root
2. Copy your chosen rule content into this file

Using with Claude Code

On-Demand Context

Place your chosen rule file in your project directory, for instance, rules/nuxt-ui.md. Then, anytime you need Claude to understand Nuxt UI best practices, simply @-mention the file path in your prompt to load it into the current session’s context.