Diagnose Vue 3 runtime errors, warnings, async failures, and SSR hydration issues.
npx skills add https://github.com/runkids/my-skills --skill vue-debug-guides
Please help me install this Agent Skill. Skill: vue-debug-guides Source: https://github.com/runkids/my-skills/tree/main/vue-debug-guides Command: npx skills add https://github.com/runkids/my-skills --skill vue-debug-guides
Vue 3 debugging and error handling for runtime issues, warnings, async failures, and SSR/hydration issues. Use when diagnosing or fixing Vue issues.
Start by loading the Vue debugging guides and use the references to resolve typical Vue 3 issues.
High-intent search queries and answers about installing and using this skill.
Vue 3 reactivity debugging involves tracing reactive state changes, computed properties, and watchers at the component level. Use the debugging guides to identify when refs, reactive objects, or computed properties fail to update, and diagnose lifecycle hook timing issues that prevent proper state synchronization.
SSR hydration mismatches occur when server-rendered HTML differs from client-side Vue markup. The toolkit diagnoses common causes: browser-only APIs called during SSR, mismatched component state between server and client, and async data loading timing, then guides you to resolution steps.
Async component loading failures happen when dynamic imports, lazy-loaded components, or promise-based data fetching fail silently or throw uncaught errors. The debugging guides help trace async failures, identify rejection causes, and implement proper error boundaries and fallback handling.
Yes. The toolkit covers composition API reactivity, prop validation errors, emit type mismatches, and lifecycle hook conflicts specific to the composition API pattern, allowing you to diagnose reactive state and type-related issues across both Options and Composition API code.
Vue 3 warnings signal potential bugs: improper prop mutations, missing keys in v-for loops, lifecycle misuse, or event handler errors. The debugging guides show you how to locate the exact component, line, and runtime condition triggering each warning, then resolve the underlying issue.
No external dependencies are required. The toolkit works with any Vue 3 project during development and production SSR. You need only Vue 3 installed and access to your project's source code and runtime logs to apply the diagnostic and error-handling reference guides.
krl76Capture, filter, and export Unity console logs during play mode.
fabio21777Diagnose Vue 3 runtime errors, warnings, async failures, and hydration issues.
sayali-ingle-pdlGenerate co-located .spec.ts test files for Vue 3 components and stores.
mgd34msuImplement session replay and error tracking for React applications with LogRocket.
