Fähigkeiten vue-debug-guides
📦

vue-debug-guides

Inhaltsrevision r1 Sicher ⚡ Enthält Skripte🌐 Netzwerkzugriff⚙️ Externe Befehle📁 Dateisystemzugriff

Vue-3-Probleme schneller debuggen

Vue-3-Fehler entstehen oft durch subtile Reaktivitäts-, Lifecycle-, Async- oder SSR-Verhaltensweisen. Dieser Skill gibt Claude und Codex fokussierte Leitfäden, um diese Probleme zu diagnostizieren und sicherere Korrekturen auszuwählen.

Unterstützt: Claude Codex Code(CC)
🥉 78 Bronze

Mit meinem Agent installieren

Kopieren Sie diese Anfrage in Ihren Agent. Sie enthält die maßgebliche Skill-Seite und das Manifest.

Agent-Anfrage
Review the Skillstore skill "vue-debug-guides" from https://skillstore.io/skills/hyf0-vue-debug-guides.md and its manifest at https://skillstore.io/api/skills/hyf0-vue-debug-guides/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Ihr Agent sollte weiterhin seinen Plan anzeigen und alle von der Sicherheitsrichtlinie verlangten Bestätigungen anfordern.

Agent-lesbare Ressourcen

Verwenden Sie diese Links, wenn ein KI-Agent, Crawler oder Skript sauberen Kontext benötigt, statt die vollständige Seite zu lesen.

Markdown-Detailseite GET /skills/hyf0-vue-debug-guides.md Signiertes manifest GET /api/skills/hyf0-vue-debug-guides/manifest Signiertes lockfile GET /api/skills/hyf0-vue-debug-guides/lockfile

Testen

„vue-debug-guides“ wird verwendet. Eine Komponenten-ref ist null, wenn v-if das Element umschaltet.

Erwartetes Ergebnis:

  • Erklärt, warum v-if das Element entfernt und die ref leert.
  • Schlägt Null-Prüfungen, nextTick-Timing oder v-show vor, wenn dauerhafter Zugriff erforderlich ist.
  • Listet Tests für Umschalt- und Initial-Render-Verhalten auf.

„vue-debug-guides“ wird verwendet. Eine SSR-Seite meldet nach dem Deployment einen Hydration-Mismatch.

Erwartetes Ergebnis:

  • Trennt wahrscheinliche Ursachen in ungültiges HTML, browser-only State, asynchrone Daten und Zufallswerte.
  • Empfiehlt den Vergleich des gerenderten Server-Markups mit dem Client-State.
  • Schlägt gezielte Korrekturen wie client-only Wrapper oder stabile Initialdaten vor.

„vue-debug-guides“ wird verwendet. Ein Watcher ruft nach schnellen Änderungen der Sucheingabe veraltete Daten ab.

Erwartetes Ergebnis:

  • Identifiziert fehlendes Async-Cleanup als wahrscheinliche Ursache.
  • Empfiehlt Abbruch oder Invalidierung älterer Requests.
  • Weist darauf hin, dass Debouncing den Cleanup-Bedarf reduzieren, aber nicht ersetzen kann.

Sicherheitsaudit

Sicher
v6 • 9.7.2026 Versionsbericht öffnen

The static analyzer flagged many risky strings, but the evidence shows they are Markdown reference examples for Vue 3 debugging topics. I found no executable malware behavior, prompt injection, credential access, or unauthorized network activity in the reviewed findings.

140
Gescannte Dateien
22,211
Analysierte Zeilen
0
Prüfelemente
0
Falschmeldungen ignoriert

Risikofaktoren

⚡ Enthält Skripte (24)
reference/async-component-error-handling.md:19 reference/async-component-error-handling.md:31 reference/async-component-error-handling.md:47 reference/async-component-error-handling.md:62 reference/async-component-error-handling.md:84 reference/async-component-keepalive-ref-issue.md:18 reference/async-component-keepalive-ref-issue.md:46 reference/async-component-suspense-control.md:26 reference/async-component-suspense-control.md:47 reference/async-component-vue-router.md:24 reference/async-component-vue-router.md:31 reference/async-component-vue-router.md:50 reference/async-component-vue-router.md:55 reference/async-component-vue-router.md:102 reference/composition-api-script-setup-async-context.md:123 reference/computed-array-mutation.md:125 reference/rendering-resolve-component-for-string-names.md:58 reference/ssr-platform-specific-apis.md:242 reference/ssr-platform-specific-apis.md:185 reference/suspense-ssr-hydration-issues.md:33 reference/ts-shallowref-for-dynamic-components.md:142 reference/ts-shallowref-for-dynamic-components.md:157 reference/ts-shallowref-for-dynamic-components.md:158 reference/ts-shallowref-for-dynamic-components.md:159
🌐 Netzwerkzugriff (43)
reference/checkbox-true-false-value-form-submission.md:88 reference/composable-avoid-hidden-side-effects.md:184 reference/composable-call-location-restrictions.md:77 reference/composable-tovalue-inside-watcheffect.md:37 reference/composable-tovalue-inside-watcheffect.md:69 reference/computed-no-side-effects.md:40 reference/computed-no-side-effects.md:74 reference/computed-no-side-effects.md:100 reference/define-expose-before-await.md:36 reference/define-expose-before-await.md:95 reference/define-expose-before-await.md:118 reference/define-expose-before-await.md:161 reference/define-expose-before-await.md:162 reference/define-expose-before-await.md:183 reference/dynamic-argument-constraints.md:70 reference/dynamic-argument-constraints.md:109 reference/plugin-global-properties-sparingly.md:36 reference/plugin-global-properties-sparingly.md:23 reference/provide-inject-default-value-factory.md:201 reference/provide-inject-synchronous-setup.md:52 reference/reactivity-markraw-for-non-reactive.md:66 reference/reactivity-markraw-for-non-reactive.md:78 reference/ssr-platform-specific-apis.md:160 reference/ssr-platform-specific-apis.md:203 reference/ssr-platform-specific-apis.md:162 reference/ssr-platform-specific-apis.md:163 reference/ssr-platform-specific-apis.md:164 reference/state-ssr-cross-request-pollution.md:11 reference/template-functions-no-side-effects.md:61 reference/template-functions-no-side-effects.md:125 reference/transition-unmount-hook-timing.md:112 reference/transition-unmount-hook-timing.md:39 reference/transition-unmount-hook-timing.md:89 reference/transition-unmount-hook-timing.md:43 reference/transition-unmount-hook-timing.md:95 reference/watch-async-cleanup.md:33 reference/watch-async-cleanup.md:71 reference/watch-async-cleanup.md:97 reference/watch-async-creation-memory-leak.md:50 reference/watcheffect-async-dependency-tracking.md:33 reference/watcheffect-async-dependency-tracking.md:72 reference/watcheffect-async-dependency-tracking.md:86 reference/watcheffect-async-dependency-tracking.md:117
⚙️ Externe Befehle (50)
reference/composition-api-vs-react-hooks-differences.md:90-96 reference/computed-no-side-effects.md:46-56 reference/computed-no-side-effects.md:85-93 reference/computed-return-value-readonly.md:143-156 reference/dynamic-argument-constraints.md:75-89 reference/provide-inject-debugging-challenges.md:86-91 reference/provide-inject-debugging-challenges.md:91-96 reference/provide-inject-debugging-challenges.md:126-127 reference/provide-inject-debugging-challenges.md:127-128 reference/provide-inject-debugging-challenges.md:128-137 reference/provide-inject-default-value-factory.md:43-46 reference/provide-inject-synchronous-setup.md:200-201 reference/provide-inject-synchronous-setup.md:201-208 reference/rendering-render-function-h-import-vue3.md:63-67 reference/rendering-render-function-return-from-setup.md:31-36 reference/rendering-render-function-return-from-setup.md:50-55 reference/rendering-render-function-return-from-setup.md:138-144 reference/rendering-render-function-slots-as-functions.md:79-81 reference/rendering-resolve-component-for-string-names.md:105-111 reference/sfc-named-exports-forbidden.md:116-118 reference/tailwind-dynamic-class-generation.md:26-36 reference/tailwind-dynamic-class-generation.md:36-40 reference/template-expressions-restrictions.md:65-82 reference/template-expressions-restrictions.md:82-92 reference/template-functions-no-side-effects.md:162-183 reference/template-ref-v-for-order.md:48-60 reference/template-ref-v-for-order.md:79-96 reference/template-ref-v-for-order.md:123-139 reference/template-ref-v-for-order.md:157-169 reference/ts-shallowref-for-dynamic-components.md:47 reference/ts-shallowref-for-dynamic-components.md:142-146 reference/watch-async-cleanup.md:33-45 reference/watch-async-cleanup.md:71-83 reference/watch-async-cleanup.md:97-112 reference/watch-deep-same-object-reference.md:71-81 reference/watch-deep-same-object-reference.md:81-84 reference/watch-deep-same-object-reference.md:84-88 reference/watch-flush-timing.md:85-99 reference/watch-reactive-property-getter.md:31-36 reference/watch-reactive-property-getter.md:36-38 reference/watch-reactive-property-getter.md:50-58 reference/watch-reactive-property-getter.md:58-66 reference/watch-reactive-property-getter.md:66-69 reference/watch-reactive-property-getter.md:82-85 reference/watch-reactive-property-getter.md:97-105 reference/watcheffect-async-dependency-tracking.md:33-54 reference/watcheffect-async-dependency-tracking.md:72-86 reference/watcheffect-async-dependency-tracking.md:86-98 reference/watcheffect-async-dependency-tracking.md:118-123 SKILL.md:7
📁 Dateisystemzugriff (5)
reference/ssr-platform-specific-apis.md:191 reference/ssr-platform-specific-apis.md:199 reference/ssr-platform-specific-apis.md:191 reference/ssr-platform-specific-apis.md:199 reference/v-model-number-modifier-behavior.md:105
Das letzte abgeschlossene statische und semantische Audit erkannte keine bestätigten Sicherheitsbefunde. Dies beweist nicht, dass der Skill keine Nebenwirkungen hat.
Geprüft von: claude Audit-Verlauf anzeigen →
Diesen Bericht teilen & zitieren

Teile den versionierten Bewertungsbericht, das neutrale Badge, die Einbettungskarte und Zitate. Skillstore berichtet Nachweise, ohne zu entscheiden, ob dieser Skill sicher ist.

Versionsbericht öffnen
Sicherheitsbewertung

Berichtslink kopieren

https://skillstore.io/skills/hyf0-vue-debug-guides/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown-Badge

[![Skillstore security assessment](https://skillstore.io/badges/skills/hyf0-vue-debug-guides/security.svg)](https://skillstore.io/skills/hyf0-vue-debug-guides?utm_source=security_passport_badge)

HTML-Badge

<a href="https://skillstore.io/skills/hyf0-vue-debug-guides?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/hyf0-vue-debug-guides/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Einbettungskarte

<iframe src="https://skillstore.io/embed/skills/hyf0-vue-debug-guides.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>
Wissenschaftliche Zitate (APA · BibTeX · CFF)

APA-Zitat

hyf0. (2026). vue-debug-guides security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/hyf0-vue-debug-guides/audits/6

BibTeX-Zitat

@techreport{hyf0-hyf0-vue-debug-guides-2026, author = {hyf0}, title = {vue-debug-guides security audit report (audit version 6)}, institution = {Skillstore}, year = {2026}, number = {6}, url = {https://skillstore.io/skills/hyf0-vue-debug-guides/audits/6}, note = {Author version unspecified} }

CITATION.cff

cff-version: 1.2.0 message: "If you use this Skill, cite its author and this versioned security audit report." title: "vue-debug-guides security audit report (audit version 6)" version: "unspecified" type: report authors: - name: "hyf0" date-released: "2026-07-09" url: "https://skillstore.io/skills/hyf0-vue-debug-guides/audits/6" identifiers: - type: other value: "skillstore:hyf0-vue-debug-guides:audit:6" description: "Skillstore immutable audit report identifier"

Varianten vergleichen

2 installierbare Varianten

Jeder Autor bleibt ein eigener installierbarer Skill. Die empfohlene Variante wird nach Skillstore-Nachweisen bewertet.

Warum diese Variante zuerst steht

Höhere Skillstore-Nutzung
vuejs-ai Empfohlen

vuejs-ai-vue-debug-guides

Skillstore-Score 78
Evidenzvertrauen Hoch
Skillstore-Nutzung 17
Aktualisiert

2026-09-09

hyf0 Aktuell

hyf0-vue-debug-guides

Skillstore-Score 78
Evidenzvertrauen Hoch
Skillstore-Nutzung 11
Aktualisiert

2026-09-09

Skillstore-Score

Warum dieser Score Evidenzvertrauen: Hoch
55
Architektur
85
Wartbarkeit
87
Inhalt
72
Gemeinschaft
83
Spezifikationskonformität

Was Sie erstellen können

Eine Vue-Laufzeitwarnung beheben

Identifiziere die wahrscheinliche Vue-Regel hinter einer Warnung und erhalte einen fokussierten Reparaturpfad.

SSR-Hydration-Mismatches debuggen

Vergleiche Server- und Client-Verhalten bei ungültigem HTML, browser-only APIs, Zufallswerten und asynchronen Daten.

Vue-Komponentenmuster prüfen

Prüfe Komponenten vor dem Release auf häufige Fallstricke bei Reaktivität, Templates, Slots, Transitions und TypeScript.

Diese Prompts ausprobieren

Eine Vue-Warnung erklären 
Verwende vue-debug-guides, um diese Vue-Warnung in einfachen Worten zu erklären und die ersten drei Dinge aufzulisten, die ich prüfen sollte: [paste warning].
Die wahrscheinliche Ursache finden 
Verwende vue-debug-guides, um dieses Vue-3-Komponentenproblem zu diagnostizieren. Konzentriere dich auf Reaktivität, Lifecycle-Timing und Template-Regeln: [paste symptom and component].
Einen SSR-Hydration-Bug prüfen 
Verwende vue-debug-guides, um diesen SSR-Hydration-Mismatch zu analysieren. Vergleiche browser-only APIs, ungültiges HTML, asynchrone Daten, Zufälligkeit und client-only Rendering: [paste details].
Ein komplexes Vue-Muster auditieren 
Verwende vue-debug-guides, um dieses Vue-3-Muster auf versteckte Reaktivitäts-, Async-Cleanup-, Slot-, Transition- und TypeScript-Fallstricke zu prüfen. Gib priorisierte Korrekturen an: [paste code].

Bewährte Praktiken

  • Füge die exakte Warnung, den Komponenten-Snippet und die Vue-Version ein, wenn du um Hilfe bittest.
  • Frage nach dem kleinsten Reproduktionspfad, bevor du die Architektur änderst.
  • Validiere die vorgeschlagene Korrektur im Browser und im SSR-Modus, wenn Hydration beteiligt ist.

Vermeiden

  • Behandle nicht jede Vue-Warnung als Framework-Bug, bevor du dokumentierte Einschränkungen geprüft hast.
  • Kopiere keine Beispiel-Snippets, ohne Pfade, Cleanup und Sicherheitsgrenzen anzupassen.
  • Unterdrücke keine Hydration- oder TypeScript-Fehler, bevor du die Ursache gefunden hast.

Häufig gestellte Fragen

Behebt dieser Skill Vue-Code automatisch?
Er bietet Diagnose- und Reparaturanleitung. Claude Code kann Änderungen anwenden, wenn du es bittest, dein Projekt zu bearbeiten.
Ist er nur für Vue 3?
Ja. Die Leitfäden konzentrieren sich auf Vue 3, Composition API, script setup und zugehöriges Vue-3-Verhalten.
Kann er bei SSR-Hydration-Fehlern helfen?
Ja. Er enthält Leitfäden zu Ursachen von Hydration-Mismatches, plattformspezifischen APIs, Suspense, Teleport und Problemen mit gemeinsam genutztem State.
Kann er TypeScript-Probleme in Vue-Komponenten debuggen?
Ja. Er behandelt häufige TypeScript-Fallstricke bei Props, Emits, Template-Refs, Event-Handlern und reaktiven Objekten.
Benötigt er Netzwerkzugriff?
Nein. Der Skill ist ein Referenzleitfaden. Netzwerkaufrufe, die in Findings gezeigt werden, sind Beispiele innerhalb der Dokumentation.
Wie erhalte ich das beste Ergebnis?
Gib das genaue Symptom, den relevanten Komponentencode, die Vue-Version, das Build-Tool und an, ob SSR beteiligt ist.

Entwicklerdetails

Autor

hyf0

Lizenz

MIT

Skillstore-Revision

r1

Versionshinweis

Der Autor hat keine Version angegeben.

Repository

https://github.com/hyf0/vue-skills/tree/main/skills/vue-debug-guides/

Ref.

1ffa7643651792ccb4bd3b15d924d2c97edff755

Aktualität der Wartung

22.7.2026

Nutzung

8 Downloads · 322 Aufrufe

Dateistruktur

📁 reference/

📄 animation-key-for-rerender.md

📄 animation-transitiongroup-performance.md

📄 async-component-error-handling.md

📄 async-component-keepalive-ref-issue.md

📄 async-component-suspense-control.md

📄 async-component-vue-router.md

📄 attrs-event-listener-merging.md

📄 checkbox-true-false-value-form-submission.md

📄 cleanup-side-effects.md

📄 click-events-on-components.md

📄 component-naming-conflicts.md

📄 component-ref-requires-defineexpose.md

📄 composable-avoid-hidden-side-effects.md

📄 composable-call-location-restrictions.md

📄 composable-naming-return-pattern.md

📄 composable-tovalue-inside-watcheffect.md

📄 composition-api-not-functional-programming.md

📄 composition-api-script-setup-async-context.md

📄 composition-api-vs-react-hooks-differences.md

📄 computed-array-mutation.md

📄 computed-conditional-dependencies.md

📄 computed-no-parameters.md

📄 computed-no-side-effects.md

📄 computed-return-value-readonly.md

📄 configure-app-before-mount.md

📄 declare-emits-for-documentation.md

📄 define-expose-before-await.md

📄 define-model-default-value-sync.md

📄 defineEmits-must-be-top-level.md

📄 defineEmits-no-runtime-and-type-mixed.md

📄 definemodel-object-mutation-no-emit.md

📄 dom-update-timing-nexttick.md

📄 dynamic-argument-constraints.md

📄 dynamic-component-registration-vite.md

📄 event-modifier-order-matters.md

📄 exact-modifier-for-precise-shortcuts.md

📄 fallthrough-attrs-overwrite-vue3.md

📄 in-dom-template-parsing-caveats.md

📄 inheritattrs-false-for-wrapper-components.md

📄 keepalive-router-nested-double-mount.md

📄 keepalive-transition-memory-leak.md

📄 keyup-modifier-timing.md

📄 lifecycle-dom-access-timing.md

📄 lifecycle-hooks-synchronous-registration.md

📄 lifecycle-ssr-awareness.md

📄 local-components-not-in-descendants.md

📄 mount-return-value.md

📄 multi-root-component-class-attrs.md

📄 native-event-collision-with-emits.md

📄 no-passive-with-prevent.md

📄 no-v-if-with-v-for.md

📄 perf-computed-object-stability.md

📄 perf-props-stability-update-optimization.md

📄 plugin-global-properties-sparingly.md

📄 plugin-install-before-mount.md

📄 plugin-prefer-provide-inject-over-global-properties.md

📄 plugin-typescript-type-augmentation.md

📄 prop-defineprops-scope-limitation.md

📄 provide-inject-debugging-challenges.md

📄 provide-inject-default-value-factory.md

📄 provide-inject-reactivity-not-automatic.md

📄 provide-inject-synchronous-setup.md

📄 reactive-destructuring.md

📄 reactivity-debugging-hooks.md

📄 reactivity-markraw-for-non-reactive.md

📄 reactivity-proxy-identity-hazard.md

📄 reactivity-same-tick-batching.md

📄 ref-value-access.md

📄 refs-in-collections-need-value.md

📄 render-function-avoid-internal-vnode-properties.md

📄 render-function-vnodes-must-be-unique.md

📄 rendering-render-function-h-import-vue3.md

📄 rendering-render-function-return-from-setup.md

📄 rendering-render-function-slots-as-functions.md

📄 rendering-resolve-component-for-string-names.md

📄 select-initial-value-ios-bug.md

📄 self-referencing-component-name.md

📄 sfc-named-exports-forbidden.md

📄 sfc-scoped-css-child-component-styling.md

📄 sfc-scoped-css-dynamic-content.md

📄 sfc-scoped-css-slot-content.md

📄 sfc-script-setup-reactivity.md

📄 slot-forwarding-to-child-components.md

📄 slot-implicit-default-content.md

📄 slot-name-reserved-prop.md

📄 slot-named-scoped-explicit-default.md

📄 slot-render-scope-parent-only.md

📄 slot-v-slot-on-components-or-templates-only.md

📄 ssr-hydration-mismatch-causes.md

📄 ssr-platform-specific-apis.md

📄 state-ssr-cross-request-pollution.md

📄 suspense-no-builtin-error-handling.md

📄 suspense-ssr-hydration-issues.md

📄 tailwind-dynamic-class-generation.md

📄 teleport-scoped-styles-limitation.md

📄 teleport-ssr-hydration.md

📄 teleport-target-must-exist.md

📄 template-expressions-restrictions.md

📄 template-functions-no-side-effects.md

📄 template-ref-null-with-v-if.md

📄 template-ref-unwrapping-top-level.md

📄 template-ref-v-for-order.md

📄 textarea-no-interpolation.md

📄 transition-group-flip-inline-elements.md

📄 transition-group-move-animation-position-absolute.md

📄 transition-group-no-default-wrapper-vue3.md

📄 transition-js-hooks-done-callback.md

📄 transition-nested-duration.md

📄 transition-reusable-scoped-style.md

📄 transition-router-view-appear.md

📄 transition-type-when-mixed.md

📄 transition-unmount-hook-timing.md

📄 ts-defineprops-boolean-default-false.md

📄 ts-defineprops-imported-types-limitations.md

📄 ts-event-handler-explicit-typing.md

📄 ts-reactive-no-generic-argument.md

📄 ts-shallowref-for-dynamic-components.md

📄 ts-template-ref-null-handling.md

📄 ts-template-type-casting.md

📄 ts-withdefaults-mutable-factory-function.md

📄 undeclared-emits-double-firing.md

📄 use-template-ref-vue35.md

📄 v-else-must-follow-v-if.md

📄 v-for-component-props.md

📄 v-for-computed-reverse-sort.md

📄 v-for-key-attribute.md

📄 v-for-range-starts-at-one.md

📄 v-if-null-check-order.md

📄 v-model-ignores-html-attributes.md

📄 v-model-ime-composition.md

📄 v-model-number-modifier-behavior.md

📄 v-show-template-limitation.md

📄 watch-async-cleanup.md

📄 watch-async-creation-memory-leak.md

📄 watch-deep-same-object-reference.md

📄 watch-flush-timing.md

📄 watch-reactive-property-getter.md

📄 watcheffect-async-dependency-tracking.md

📄 watcheffect-flush-post-for-refs.md

📄 SKILL.md