AIKraft/AI/Войти
AIKraft/Skills/Vue: руководства по отладке

Vue: руководства по отладке

Vue 3 debugging and error handling for runtime errors, warnings, async failures, and SSR/hydration issues. Use when diagnosing or fixing Vue issues.

vuejs-ai official Разработка

Что делает навык

Навык предоставляет руководство по отладке Vue 3, охватывая runtime-ошибки, предупреждения, асинхронные сбои и проблемы SSR/hydration. Он помогает диагностировать и исправлять проблемы, связанные с реактивностью, вычисляемыми свойствами и наблюдателями, ссылаясь на специализированные поднавытки для конкретных сценариев.

Когда применять

  • Диагностика неожиданных повторных рендеров и обновлений состояния в приложении.
  • Исправление ошибок, связанных с доступом к .value у ref или деструктуризацией реактивных объектов.
  • Отладка проблем с hydration и SSR, а также асинхронных сбоев.
  • Анализ поведения вычисляемых свойств (computed), таких как побочные эффекты или условные зависимости.
  • Исследование проблем с наблюдателями (watchers), например, срабатывание один раз за тик.

Как работает

  1. Определите категорию проблемы: реактивность, computed, watchers или общие runtime/SSR ошибки.
  2. Используйте ссылки на специализированные поднавытки (например, reactivity-debugging-hooks, ref-value-access) для углубленной диагностики конкретных симптомов.
  3. Применяйте рекомендации по обработке ошибок и предупреждений для исправления runtime-сбоев.
  4. Проверяйте корректность работы с коллекциями (arrays, Maps, Sets) и прокси-объектами на соответствие лучшим практикам.
  5. Используйте vue-best-practices для выявления общих подводных камней и лучших практик разработки.

Примеры запросов агенту

Почему мои ref внутри массива не обновляются автоматически в шаблоне?
Как отладить проблему, когда computed свойство не обновляется после условной логики?
Помоги исправить ошибку hydration в SSR при использовании Vue 3.

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «vue-debug-guides» из репозитория: # https://github.com/vuejs-ai/skills
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r vue-debug-guides/ ~/.claude/skills/vue-debug-guides/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.