Vue Development
Enforces Vue 3.4+ TypeScript patterns: defineModel, typed emits, Testing Library over test-utils.
Test report
- Verdict
- Tested · Works
- Score
- Tested
- Jul 14, 2026
- Environment
- Claude Code 2.x (agent harness)
- Upstream re-checked
- Aug 10, 2026 · 2e677a4
Built the same UserAvatar component twice: unguided it came out as a clickable non-semantic div with no alt text or error handling and a manual fetch mock in the test; skill-guided it became an accessible button with alt text, try/catch error state, defineModel, and an MSW-backed Testing Library test - a real, visible gap. But the README cites SKILL-CREATION-SUMMARY.md, FINAL-STATUS.md, OPTIMIZATION-SUMMARY.md and a test-scenarios/ folder as evidence for its '100% compliance / PRODUCTION-READY' claim, and none of those files exist in the cloned repo.
Scored on four weighted criteria — install, triggering, output vs. baseline, docs. How scoring works
- Installs cleanly 5/5
- Triggers reliably 5/5
- Output vs. baseline 8/10
- Docs & honesty 2/5
What Vue Development does
A Vue 3 + TypeScript pattern-enforcement skill for planning and implementing components, composables, routing, and tests - pushes defineModel() over manual modelValue props, typed defineProps/defineEmits over runtime validation, and @testing-library/vue + MSW over test-utils and manual mocks. Triggers when architecting or writing Vue 3 Composition-API code; explicitly opts out of Vue 2 and Options API work.
How to install Vue Development
git clone https://github.com/alexanderop/claude-skill-vue-development
cd claude-skill-vue-development
mkdir -p ~/.claude/skills
cp -r skills/vue-development ~/.claude/skills/vue-development
Skills live in ~/.claude/skills/ (global) or .claude/skills/
(per-project). Restart Claude Code after installing.
Commands — how to trigger Vue Development
-
/vue-developmentEnforces Vue 3.4+ TypeScript patterns: defineModel, typed emits, Testing Library over test-utils.
It also activates on plain-language prompts like these:
-
Build a UserAvatar component in Vue 3 with a v-model prop -
Write typed defineProps and defineEmits for this Vue form -
Add a Testing Library test for my Vue composable, not test-utils
Frequently asked questions
- Is the Vue Development skill free?
- Yes. The skill itself is free from alexanderop/claude-skill-vue-development. SkillProof publishes the install command and an independent test verdict at no cost.
- Does Vue Development work with Claude Code?
- We tested it with Claude Code 2.x (agent harness) on Jul 14, 2026. Verdict: Tested · Works. Built the same UserAvatar component twice: unguided it came out as a clickable non-semantic div with no alt text or error handling and a manual fetch mock in the test; skill-guided it became an accessible button with alt text, try/catch error state, defineModel, and an MSW-backed Testing Library test - a real, visible gap. But the README cites SKILL-CREATION-SUMMARY.md, FINAL-STATUS.md, OPTIMIZATION-SUMMARY.md and a test-scenarios/ folder as evidence for its '100% compliance / PRODUCTION-READY' claim, and none of those files exist in the cloned repo.
- What is the Vue Development SkillProof Score?
- 8.0/10 — installs cleanly 5/5, triggers reliably 5/5, output vs. baseline 8/10, docs & honesty 2/5.
- How do I install Vue Development?
- Copy the install command from this page, run it in your terminal, and restart Claude Code. Skills live in ~/.claude/skills/ (global) or .claude/skills/ inside a project.
- Can I use Vue Development with Cursor, Copilot, Gemini CLI, Codex or other AI tools?
- The SKILL.md format is native to Claude (Claude Code, Desktop, claude.ai). The instructions inside adapt to other assistants: Cursor rules, GitHub Copilot instructions, Windsurf rules, Custom GPTs, AGENTS.md for OpenAI Codex, and GEMINI.md for Google Gemini CLI — our conversion guides cover each, and the free converter on the tools page does the wrapping for you.