Habilidades vue-debug-guides

📦

vue-debug-guides

Name: vue-debug-guides
Author: hyf0

Revisión del contenido r1 Seguro ⚡ Contiene scripts🌐 Acceso a red⚙️ Comandos externos📁 Acceso al sistema de archivos

Depura problemas de Vue 3 más rápido

Los errores de Vue 3 suelen venir de comportamientos sutiles de reactividad, ciclo de vida, asincronía o SSR. Esta skill ofrece a Claude y Codex guías enfocadas para diagnosticar esos problemas y elegir correcciones más seguras.

Compatible con: Claude Codex Code(CC)

🥉 78 Bronce

Instalar con mi Agente

Copia esta solicitud en tu Agente. Incluye la página canónica del Skill y el manifiesto.

Solicitud de agente

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.

Tu Agente debe seguir mostrando su plan y solicitar cualquier confirmación exigida por la política de seguridad.

Recursos legibles por agentes

Usa estos enlaces cuando un agente de IA, crawler o script necesite contexto limpio en vez de leer la página completa.

Detalle Markdown GET /skills/hyf0-vue-debug-guides.md Manifest firmado GET /api/skills/hyf0-vue-debug-guides/manifest Lockfile firmado GET /api/skills/hyf0-vue-debug-guides/lockfile

Pruébalo

Usando "vue-debug-guides". Un ref de componente es null cuando v-if alterna el elemento.

Resultado esperado:

Explica por qué v-if elimina el elemento y limpia el ref.
Sugiere comprobaciones de null, sincronización con nextTick o v-show cuando se requiere acceso persistente.
Enumera pruebas para el comportamiento de alternancia y renderizado inicial.

Usando "vue-debug-guides". Una página SSR informa un desajuste de hidratación después del despliegue.

Resultado esperado:

Separa las causas probables en HTML inválido, estado solo de navegador, datos async y valores aleatorios.
Recomienda comparar el marcado renderizado en el servidor con el estado del cliente.
Sugiere correcciones específicas como wrappers solo de cliente o datos iniciales estables.

Usando "vue-debug-guides". Un watcher obtiene datos obsoletos después de cambios rápidos en una entrada de búsqueda.

Resultado esperado:

Identifica la falta de limpieza async como la causa probable.
Recomienda cancelación o invalidación para solicitudes anteriores.
Señala que el debounce puede reducir, pero no sustituir, la necesidad de limpieza.

Auditoría de seguridad

Seguro

v6 • 9/7/2026 Abrir el informe versionado

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

Archivos escaneados

22,211

Líneas analizadas

Elementos de revisión

Falsos positivos ignorados

Factores de riesgo

⚡ Contiene scripts (24)

🌐 Acceso a red (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

⚙️ Comandos externos (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

📁 Acceso al sistema de archivos (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

La auditoría estática y semántica completada más reciente no detectó hallazgos de seguridad confirmados. Esto no demuestra que el skill no tenga efectos secundarios.

Auditado por: claude Ver historial de auditorías →

Compartir y citar este informe

Comparte el informe de evaluación versionado, la insignia neutral, la tarjeta insertable y las citas. Skillstore presenta evidencias sin decidir si este Skill es seguro.

Abrir el informe versionado

Copiar enlace del informe

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

Insignia Markdown

[![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)

Insignia HTML

<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>

Tarjeta para insertar

<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>

Citas académicas (APA · BibTeX · CFF)

Cita APA

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

Cita BibTeX

@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"

Comparar variantes

2 variantes instalables

Cada autor sigue siendo un skill instalable independiente. La variante recomendada se ordena según la evidencia de Skillstore.

Por qué esta variante es la primera

Mayor uso en Skillstore

Autor / fuente Puntuación de Skillstore Confianza de la evidencia Uso en Skillstore Actualizado

vuejs-ai Recomendado

vuejs-ai-vue-debug-guides

Puntuación de Skillstore 78

Confianza de la evidencia Alto

Uso en Skillstore 17

Actualizado

2026-09-09

hyf0 Actual

hyf0-vue-debug-guides

Puntuación de Skillstore 78

Confianza de la evidencia Alto

Uso en Skillstore 11

Actualizado

2026-09-09

Puntuación de Skillstore

Por qué esta puntuación Confianza de la evidencia: Alto

Arquitectura

Mantenibilidad

Contenido

Comunidad

Cumplimiento de la especificación

Lo que puedes crear

Corregir una advertencia de runtime de Vue

Identifica la regla probable de Vue detrás de una advertencia y obtiene una ruta de reparación enfocada.

Depurar desajustes de hidratación SSR

Compara el comportamiento del servidor y del cliente para HTML inválido, APIs solo de navegador, valores aleatorios y datos async.

Revisar patrones de componentes Vue

Revisa componentes en busca de problemas frecuentes de reactividad, template, slot, transición y TypeScript antes del lanzamiento.

Prueba estos prompts

Explicar una advertencia de Vue

Usa vue-debug-guides para explicar esta advertencia de Vue en términos simples y enumera las tres primeras cosas que debería revisar: [pega la advertencia].

Encontrar la causa raíz probable

Usa vue-debug-guides para diagnosticar este problema de componente Vue 3. Céntrate en reactividad, tiempos del ciclo de vida y reglas de template: [pega el síntoma y el componente].

Revisar un bug de hidratación SSR

Usa vue-debug-guides para analizar este desajuste de hidratación SSR. Compara APIs solo de navegador, HTML inválido, datos async, aleatoriedad y renderizado solo de cliente: [pega los detalles].

Auditar un patrón Vue complejo

Usa vue-debug-guides para revisar este patrón de Vue 3 en busca de problemas ocultos de reactividad, limpieza async, slot, transición y TypeScript. Proporciona correcciones priorizadas: [pega el código].

Mejores prácticas

Pega la advertencia exacta, el snippet del componente y la versión de Vue cuando pidas ayuda.
Pide la ruta de reproducción más pequeña antes de cambiar la arquitectura.
Valida la corrección propuesta en el navegador y en modo SSR cuando haya hidratación involucrada.

Evitar

No trates cada advertencia de Vue como un bug del framework antes de revisar las advertencias documentadas.
No copies snippets de ejemplo sin adaptar rutas, limpieza y límites de seguridad.
No suprimas errores de hidratación o TypeScript antes de encontrar la causa raíz.