vue-skills
A set of skills for Vue 3 development: Composition API practices, router, Pinia, testing, JSX, Options API and debugging
- 3,334 ★ on the repository
- Last commit
- MIT
Minimal access
Why this level
- The skills consist only of instructions and references and run no code
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/vue-skillsDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- The skills consist only of instructions and references and run no code
This is third-party code. Review the repository files before installing.
What it does
The set gives the agent eight skills for Vue 3 development. The main skill sets a default stack of Composition API with script setup and TypeScript, requires reading core references on reactivity, single-file components, data flow and composables, and asks the agent to plan component boundaries before writing code. Separate skills cover Vue Router 4, Pinia, testing with Vitest and Playwright, JSX, the Options API, building reusable composables, and debugging errors and SSR hydration issues. Each skill is a SKILL.md with references on specific topics and common mistakes. Rules were selected through automated evals: a rule was kept only if it let the model solve what it could not solve without the skill.
Who it is for. For frontend developers on Vue 3 who want the agent to follow established ecosystem practices.
Good fit when
- The agent writes or refactors Vue 3 code and .vue files
- You need correct patterns for Pinia, Vue Router or Vitest tests
- You are debugging runtime errors or SSR hydration mismatches
Not a fit when
- The project is not on Vue; the references target Vue 3 and its ecosystem
- You want neutral help without being pushed toward Composition API and TypeScript
Example request
Use vue skill and build a todo list component with Composition API and PiniaLimitations
This is an early community experiment, not an official Vue team project: the author notes that rules are derived from real issues but may be imprecise due to hallucinations and asks for feedback. The main skill defaults to Composition API, script setup and TypeScript; for the Options API or JSX you install separate skills. Published skills live on the main branch while development happens on dev. The skills are references and instructions only and do not run code themselves.
How to disable. If installed as a Claude Code plugin, remove it via /plugin. For a manual install, remove the skill folders from the agent's skills directory.
FAQ
Is this an official Vue project?
No. It is a community experiment; the author plans to propose transferring it to the Vue organization if it proves valuable, but that has not happened yet.
Do I have to install all eight skills?
No. The vue-skills-bundle installs them all at once, but you can install only the ones you need, for example vue-best-practices@vue-skills or vue-router-best-practices@vue-skills.
Discussion
No questions or reviews yet.
Related
SkillsThirty-plus skills for Vue, Pinia, Vue Router, Reka UI and VueUse, tied to package versions and rebuilt with each release.
A skill that points the agent to ready VueUse composables for Vue 3 and Nuxt, with a usage and type reference for each function
A skill set for the Vue, Vite and Nuxt stack: the author's conventions plus digests of official tool documentation
shadcn-vue skill for agents
shadcn-vue skill
The shadcn-vue skill reads your project settings and teaches an agent to add components, forms and themes of the Vue port of shadcn/ui by its rules
Nine skills built into the Fantastic-admin Vue 3 admin framework: CRUD pages, forms, routes, stores and theme customization
A plugin of 30 skills for Vue, Nuxt and NuxtHub for Claude Code, Codex, Cursor and Copilot, with the Nuxt MCP server attached
README in short
The README presents a set of skills for Vue 3 development and openly calls it an early community experiment. Install goes through npx skills add or as a Claude Code plugin with a bundle and individual skills. For reliable triggering it suggests starting the prompt with use vue skill. A table lists eight skills and when to use them: core practices, Options API, router, Pinia, testing, JSX, debugging and composable creation. It describes the validation method: a baseline run without the skill and a run with it, keeping a rule only if it enabled a solution. MIT licensed.
README badge
Original SKILL.md
--- name: vue-best-practices description: MUST be used for Vue.js tasks. Strongly recommends Composition API with `<script setup>` and TypeScript as the standard approach. Covers Vue 3, SSR, Volar, vue-tsc. Load for any Vue, .vue files, Vue Router, Pinia, or Vite with Vue work. ALWAYS use Composition API unless the project explicitly requires Options API. license: MIT metadata: author: github.com/vuejs-ai version: "18.0.0" --- # Vue Best Practices Workflow Use this skill as an instruction set. Follow the workflow in order unless the user explicitly asks for a different order. ## Core Principles - **Keep state predictable:** one source of truth, derive everything else. - **Make data flow explicit:** Props down, Events up for most cases. - **Favor small, focused components:** easier to test, reuse, and maintain. - **Avoid unnecessary re-renders:** use computed properties and watchers wisely. - **Readability counts:** write clear, self-documenting code.