vue-skills

Editor Review

Coding assistants writing Vue often mix outdated patterns with vague reactivity. These skills split the Composition API, Options API, router, state, testing, and debugging into modules you can install alone. They separate capability rules, where the model fails without the skill, from efficiency rules that only improve an answer it could already attempt. Eval comparison runs a baseline without the skill and again with it, and a rule stays only if it turns a previous failure into a pass. A set prefix in the prompt triggers the skill explicitly. It fits frontend developers who already use a coding assistant for Vue 3 and want output closer to these documented conventions.

AI Tools Navigator Editorial TeamUpdated: 2026-10-09

What is vue-skills

vue-skills is a set of Vue 3 development skills in the vuejs-ai/skills repository. They steer a coding assistant toward documented patterns for the Composition API, Options API, router, state, and tests. You can install the bundle with the skills command, or install one skill from the Claude Code plugin marketplace. The project describes itself as an early community experiment. Rules come from real issues, but the author warns they may be incomplete and plans to propose a transfer to the Vue organization only after the project proves useful.

vue-skills Key Features

Composition API patterns

vue-best-practices covers common gotchas in the Composition API and TypeScript, plus server-rendering notes and performance patterns.

Router and state skills

The router skill covers navigation guards, route params, and component lifecycle. The state skill covers store setup and reactive state patterns.

Testing and debug guides

The testing skill targets component and end-to-end tests. The debug skill covers runtime errors, warnings, async failures, and hydration issues.

Adaptable composables

create-adaptable-composable asks for reactive input types that accept either a plain value or a ref, so callers are not forced into one shape.

vue-skills Key Advantages

The bundle can be installed whole, or a single module such as router or Composition API can be installed alone

A set prefix in the prompt triggers the skill explicitly instead of relying on keyword overlap

A rule is kept only after a without-skill and with-skill comparison shows it fixes a case that previously failed

Options API, testing, and debugging are separate skills, so one topic does not require installing everything

vue-skills Use Cases

Scaffold a todo app

When a developer asks for a todo app, the skill moves state into a composable and splits out separate components.

Write a reusable composable

A composable that toggles hidden state takes flexible reactive inputs so callers can pass a plain value or a ref.

Debug a hydration error

When a hydration warning appears after server rendering, the debug skill is used against the notes on runtime and async errors.

Frequently Asked Questions

▶Is vue-skills maintained by the Vue organization?

The repository describes it as an early community experiment, not a project already transferred to the official organization. The author says the skills come from real issues but may be incomplete because of model hallucinations, and asks for feedback. If the project proves useful, the author plans to propose moving it to the Vue organization. Treat the skill docs in the repo as the source, not as an official specification.

▶How do I make an assistant use these skills more reliably?

The repository recommends prefixing the prompt with "use vue skill" so the skill is triggered explicitly and the assistant follows the documented patterns. Without that prefix, triggering depends on keyword overlap and can be inconsistent. Claude Code users can also install a single skill from the plugin marketplace, such as best practices or the router skill alone.

▶Which skills can be installed on their own?

The readme lists skills for the Composition API, Options API, router, Pinia state, testing, JSX, debugging, and creating adaptable composables. Testing covers component and end-to-end tests. Debugging covers runtime errors and hydration. Each can be installed alone, or the whole bundle at once. Development happens on the dev branch, and main holds published skills only.

vue-skills

Editor Review

What is vue-skills

Basic Info

Best For

vue-skills Key Features

vue-skills Key Advantages

vue-skills Use Cases

Frequently Asked Questions

Latest News

User Reviews

Seele AI

Skywork

Flowith

Manus

Operator

金灵AI

星辰Agent

MasterAgent

vue-skills

Editor Review

What is vue-skills

Basic Info

Best For

vue-skills Key Features

vue-skills Key Advantages

vue-skills Use Cases

Frequently Asked Questions

Latest News

User Reviews

Related Tools

Seele AI

Skywork

Flowith

Manus

Operator

金灵AI

星辰Agent

MasterAgent