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.
We provide two versions of Nuxt UI rules to fit different needs:
- ~600 lines - Comprehensive documentation and examples
- Detailed breaking changes - Full v2 β v3 migration guide
- Advanced patterns - Theming, performance, accessibility, TypeScript
- Best for most projects and learning
- ~140 lines - Optimized for AI assistants with token limits
- Essential changes only - Core breaking changes and patterns
- Quick reference - Most common pitfalls to avoid
- For AI assistants with limited context
Recommended β Use the complete rules
For AI assistants with limited context β Use the minimal rules
To integrate these guidelines with Cursor, follow these steps:
-
Create a new file named
nuxt-ui.mdc
inside the.cursor/rules/
directory of your project. -
Copy the complete content from your chosen rule file:
- Complete: Copy everything from nuxt-ui.md
- Minimal: Copy everything from nuxt-ui-minimal.md
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.