vue-debug-guides
π―Skillfrom hyf0/vue-skills
|Diagnoses and resolves Vue 3 runtime errors, async failures, hydration issues, and common component debugging challenges.
Overview
A Vue 3 debugging skill by hyf0 covering runtime errors, warnings, async failures, and SSR/hydration issues. Companion to vue-best-practices, focused specifically on diagnosing and fixing Vue issues.
Key Features
- Reactivity debugging with hooks for tracing unexpected re-renders
- Watcher debugging for async cleanup and memory leak prevention
- Component issues: ref access, naming conflicts, multi-root styling
- Props/emits troubleshooting: defineProps scope, event collision, double-firing
- Template compilation errors and v-if/v-else edge cases
Who is this for?
Vue 3 developers encountering runtime errors, hydration mismatches, or component bugs who want Claude to systematically diagnose and fix the issue using documented solutions.
Same repository
hyf0/vue-skills(11 items)
Installation
npx vibeindex add hyf0/vue-skills --skill vue-debug-guidesnpx skills add hyf0/vue-skills --skill vue-debug-guides~/.claude/skills/vue-debug-guides/SKILL.mdSKILL.md
More from this repository10
A Vue 3 skill for AI agents providing Composition API and TypeScript best practices, common gotcha prevention, SSR guidance, and performance patterns for Claude Code and Cursor.
Agent skills for Vue 3 development, derived from real-world issues and providing specialized patterns for AI agents to enhance Vue development workflows.
Agent skills for Vue 3 development, derived from real-world issues and providing specialized patterns for AI agents to enhance Vue development workflows.
Agent skills for Vue 3 development, derived from real-world issues and providing specialized patterns for AI agents to enhance Vue development workflows.
Vue 3 Options API best practices covering TypeScript integration, method binding, lifecycle hooks, computed properties, and common gotchas like arrow function pitfalls and stateful method lifecycle management.
Agent skills for Vue 3 development, derived from real-world issues and providing specialized patterns for AI agents to enhance Vue development workflows.
Agent skills for Vue 3 development, derived from real-world issues and providing specialized patterns for AI agents to enhance Vue development workflows.
Provides comprehensive Vue.js development guidelines and best practices for creating, refactoring, and reviewing Vue and Nuxt projects with a focus on code quality
Provides Pinia state management best practices for Vue.js applications including store patterns, code organization, and performance optimization
Provides VueUse composable best practices for efficiently leveraging utility functions and reactive patterns in Vue.js applications