vueuse-functions
Aplicar composables de VueUse en Vue y Nuxt
Los equipos de Vue y Nuxt a menudo reescriben comportamientos que VueUse ya resuelve. Esta skill asigna requisitos a composables probados y patrones de uso.
Descargar el ZIP de la skill
Subir en Claude
Ve a Configuración → Capacidades → Skills → Subir skill
Activa y empieza a usar
Recursos legibles por agentes
Usa estos enlaces cuando un AI Agent, crawler o script necesite contexto limpio en lugar de leer toda la página.
Pruébalo
Usando "vueuse-functions". Una solicitud para agregar un controlador de clic fuera de un dropdown.
Resultado esperado:
El asistente recomienda onClickOutside, identifica la ref del elemento objetivo y describe el comportamiento de limpieza gestionado por VueUse.
Usando "vueuse-functions". Una solicitud para conservar una preferencia de la interfaz de usuario.
Resultado esperado:
El asistente sugiere useStorage o useLocalStorage, advierte contra guardar secretos y nombra la clave de almacenamiento y el valor de respaldo.
Usando "vueuse-functions". Una solicitud para transmitir la entrada de cámara en un componente de Vue.
Resultado esperado:
El asistente recomienda useUserMedia, señala los requisitos de permisos del navegador y describe la gestión de inicio, detención y vista previa.
Auditoría de seguridad
Riesgo medioThe static analyzer reported many severe patterns, but targeted review shows they are primarily Markdown references, inline code, URLs, and VueUse API examples rather than executable skill logic. No prompt injection or malicious intent was found. The skill is publishable with a medium warning because it can guide users toward network, browser storage, cookie, local file, media-device, and Electron IPC APIs.
Problemas de riesgo medio (4)
Problemas de riesgo bajo (2)
Factores de riesgo
🌐 Acceso a red (5)
📁 Acceso al sistema de archivos (3)
Patrones detectados
Puntuación de calidad
Lo que puedes crear
Crear comportamientos de interfaz reactivos más rápido
Usa utilidades de VueUse para almacenamiento, eventos, estado de elementos, temporizadores y API del navegador sin escribir composables personalizados.
Estandarizar patrones de funcionalidades en Nuxt
Orienta a los asistentes hacia elecciones coherentes de VueUse al agregar estado, red y comportamiento de ciclo de vida en páginas de Nuxt.
Modernizar utilidades frontend personalizadas
Reemplaza utilidades reactivas a medida por composables documentados de VueUse conservando las convenciones del proyecto.
Prueba estos prompts
Estoy creando una funcionalidad de Vue 3 que rastrea el tamaño de la ventana. Usa esta skill para elegir el mejor composable de VueUse y explicar por qué.
Agrega un interruptor de modo oscuro en Nuxt 3 usando VueUse. Sigue las referencias de la skill y mantén la implementación mínima.
Revisa este componente de Vue y reemplaza la lógica personalizada de event listener o almacenamiento por composables apropiados de VueUse.
Planifica una funcionalidad de Vue que use API de red y permisos del navegador. Usa VueUse donde sea útil y señala las comprobaciones de seguridad.
Mejores prácticas
- Consulta el archivo de referencia correspondiente antes de elegir un composable.
- Revisa el impacto en la privacidad de las API de almacenamiento, red, archivos y medios.
- Mantén explícitas las integraciones externas cuando la dependencia no esté instalada.
Evitar
- No almacenes tokens ni datos personales en el almacenamiento del navegador de forma predeterminada.
- No agregues endpoints de red sin revisar los datos que se les envían.
- No fuerces VueUse cuando el código Vue simple sea más claro.
Preguntas frecuentes
¿Qué proyectos pueden usar esta skill?
¿Instala VueUse?
¿Puede elegir entre composables similares?
¿Es segura para API sensibles del navegador?
¿Genera componentes Vue completos?
¿Reemplaza la documentación de VueUse?
Detalles del desarrollador
Estructura de archivos