_{Design inspired by HugoRCD's work}

Vue, Nuxt, and NuxtHub skills for AI coding assistants.

🔗 Related Nuxt RFC: Bundling Agent Skills in Nuxt Modules

Note

Sponsored by Cactus

Your agent is working. Don't drift into YouTube. Cactus blocks distracting websites on your Mac during the hours you choose, with a schedule that repeats every week. Built by this repo's maintainer.

Try Cactus free for 7 days. Keep it for $19.99 USD, paid once. No subscription.

Other projects

• Nuxt Skill Hub: Give your coding agent Nuxt guidance tailored to your project's modules and stack.
• Vite Doctor: Catch framework bugs in Nuxt, Vue, Nitro, and Vite before code review.

Installation

npx skills add onmax/nuxt-skills

The skills CLI auto-detects your installed agents and provides an interactive picker. Use -g for global (user-wide) or -y to install all skills.

Works with Claude Code, Cursor, Codex, OpenCode, GitHub Copilot, Antigravity, Roo Code, and more.

Claude Code Marketplace

An alternative for Claude Code users:

# Add marketplace
/plugin marketplace add onmax/nuxt-skills

# Install Nuxt Skills
/plugin install nuxt-skills@nuxt-skills

Claude Code installs Nuxt Skills as one plugin and dynamically discovers all included skill entries.

Manual Installation

Clone the repository and copy skill folders to your agent's skills directory:

Agent	Project path	Global path
Claude Code	.claude/skills/	~/.claude/skills/
Cursor	.cursor/skills/	~/.cursor/skills/
Codex	.codex/skills/	~/.codex/skills/
OpenCode	.opencode/skill/	~/.config/opencode/skill/
Copilot	.github/skills/	—

Skills

Skill	Description
vue	Vue 3 Composition API, components, composables, testing
nuxt	Nuxt 4+ server routes, routing, middleware, config
nuxt-modules	Creating Nuxt modules with defineNuxtModule, Kit utilities, testing
nuxthub	NuxtHub v0.10 database, KV, blob, cache, multi-cloud
nuxt-content	Nuxt Content collections, schemas, queries, navigation, search, MDC, and deployment
nuxt-studio	Nuxt Studio setup, auth, visual editing, drafts, media, AI, and Git publishing
nuxt-ui	Nuxt UI v4 components, theming, forms, overlays, composables
nuxt-i18n	Nuxt I18n locales, messages, routing, language switching, fallbacks, and locale SEO
reka-ui	Reka UI headless Vue components, accessible primitives, props/emits/slots
document-writer	Writing documentation for Nuxt ecosystem - MDC, style, structure, code examples
ts-library	TypeScript library authoring - exports, tsdown, API patterns, type tricks, CI
motion	Motion Vue animations - motion component, composables, scroll, gestures
nuxt-seo	Nuxt SEO meta-module - robots, sitemap, og-image, schema-org, site config
vitest	Vitest testing - test API, mocking, coverage, type testing, environments
vite	Vite build tool - config, plugins, HMR, SSR, library mode, performance
pnpm	pnpm package manager - workspaces, catalogs, CLI commands, CI/CD
tsdown	tsdown bundler - TypeScript libraries, DTS generation, package validation
tresjs	TresJS 3D framework - TresCanvas, Cientos helpers, post-processing effects
writing-web-documentation	Write and review developer docs - page types, house style, templates, web-project rules

How Skills Work

Skills follow the Agent Skills open format. They can be activated in two ways:

1. Auto-discovery — The agent reads each skill's description and loads it when relevant to your task
2. Manual invocation — Type /skill-name (e.g., /nuxt) to explicitly load a skill

You're working on...	Agent may auto-load...
.vue file	vue skill
server/api/ route	nuxt skill
nuxt.config.ts	nuxt skill
NuxtHub storage	nuxthub skill

Structure

Follows agentskills standard format.

nuxt-skills/
├── skills/                 # Skills (agentskills format)
│   ├── vue/
│   │   ├── SKILL.md        # Entry point with frontmatter
│   │   └── references/     # Sub-files loaded on-demand
│   ├── nuxt/
│   ├── nuxt-modules/
│   ├── nuxthub/
│   ├── nuxt-content/
│   ├── nuxt-studio/
│   ├── nuxt-ui/
│   ├── nuxt-i18n/
│   ├── reka-ui/
│   ├── document-writer/
│   ├── ts-library/
│   ├── motion/
│   ├── nuxt-seo/
│   ├── vitest/
│   ├── vite/
│   ├── pnpm/
│   ├── tsdown/
│   ├── tresjs/
│   └── writing-web-documentation/
└── .claude-plugin/
    ├── plugin.json         # Claude Code plugin manifest
    └── marketplace.json    # Claude Code marketplace

Automated Maintenance

Skills are kept up-to-date via GitHub Actions:

Workflow	Schedule	Purpose
update-skills.yml	Weekly (Monday)	Regenerates reka-ui and nuxt-ui docs from upstream
skill-maintenance.yml	Biweekly (1st & 15th)	Claude analyzes upstream changelogs, creates PRs if updates needed

The maintenance workflow uses claude-code-action to intelligently detect breaking changes, new features, and deprecations from upstream sources.

Resources

VueUse maintains its own current skill, so install it directly with npx skills add vueuse/skills instead of relying on a generated copy here.

• Agent Skills Spec - Open format for extending AI agent capabilities
• Claude Code Skills - Skills in Claude Code
• VS Code Agent Skills - GitHub Copilot skills in VS Code
• GitHub Agent Skills Docs - About agent skills
• OpenCode Skills - Agent skills in OpenCode
• awesome-copilot - Community collection of custom agents and prompts

Acknowledgments

• vue skill gotchas from vuejs-ai/skills vue-best-practices (200+ rules)
• vitest, vite, pnpm, tsdown skills from @antfu's skills

License

MIT