Habilidades vueuse-functions
📦

vueuse-functions

Riesgo medio 🌐 Acceso a red📁 Acceso al sistema de archivos

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.

Soporta: Claude Codex Code(CC)
⚠️ 50 Deficiente
1

Descargar el ZIP de la skill

2

Subir en Claude

Ve a Configuración → Capacidades → Skills → Subir skill

3

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 medio
v2 • 6/28/2026

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

267
Archivos escaneados
25,774
Líneas analizadas
8
hallazgos
2
Auditorías totales
Problemas de riesgo medio (4)
Privacy-sensitive browser storage guidance
The skill recommends VueUse helpers for LocalStorage, SessionStorage, and cookies. These APIs are legitimate, but generated code could persist sensitive user data if the assistant applies them without review.
Outbound network composables require endpoint review
The skill includes automatic guidance for fetch, Axios, EventSource, and WebSocket composables. Generated implementations can send application data to external services if endpoints are not reviewed.
Local file and media device APIs need user consent checks
The skill documents composables for local file access and media capture. These are browser-permission APIs, but generated features must preserve clear user consent and narrow file or device scope.
Electron IPC helpers can cross trust boundaries
The skill includes Electron ipcRenderer helpers. Generated Electron code should validate channels and payloads because renderer-to-main messages can reach privileged application logic.
Problemas de riesgo bajo (2)
Static external command findings are Markdown false positives
The reported Ruby or shell backtick execution appears to come from Markdown code fences, inline code, and install examples. No executable script or dynamic command runner was found in the reviewed files.
Keyword-based critical findings are documentation false positives
Keylogger, C2, weak crypto, credential, and path traversal alerts map to API names, URL fragments, line anchors, or ordinary documentation. No evidence of malicious collection or control flow was found.

Patrones detectados

Network request generation patternBrowser persistence patternLocal capability API pattern

Puntuación de calidad

45
Arquitectura
100
Mantenibilidad
85
Contenido
73
Comunidad
41
Seguridad
91
Cumplimiento de la especificación

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

Encontrar un composable
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é.
Implementar una funcionalidad pequeña
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.
Refactorizar lógica personalizada
Revisa este componente de Vue y reemplaza la lógica personalizada de event listener o almacenamiento por composables apropiados de VueUse.
Diseñar una integración segura
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?
Está pensada para proyectos de Vue 3 y Nuxt 3 que pueden usar composables de VueUse.
¿Instala VueUse?
No. Guía la generación de código y puede sugerir instalaciones cuando se requiere una integración externa.
¿Puede elegir entre composables similares?
Sí. Asigna requisitos a la función de VueUse más cercana y consulta la documentación de referencia incluida.
¿Es segura para API sensibles del navegador?
Requiere revisión. Algunos composables referenciados interactúan con almacenamiento, cookies, archivos, dispositivos multimedia, solicitudes de red o Electron IPC.
¿Genera componentes Vue completos?
Puede ayudar a implementar componentes, pero el asistente anfitrión sigue adaptando el código a la estructura de tu proyecto.
¿Reemplaza la documentación de VueUse?
No. Empaqueta orientación y referencias enfocadas, pero la documentación oficial sigue siendo la fuente para actualizaciones.

Detalles del desarrollador

Estructura de archivos

📁 references/

📄 computedAsync.md

📄 computedEager.md

📄 computedInject.md

📄 computedWithControl.md

📄 createEventHook.md

📄 createGenericProjection.md

📄 createGlobalState.md

📄 createInjectionState.md

📄 createProjection.md

📄 createRef.md

📄 createReusableTemplate.md

📄 createSharedComposable.md

📄 createTemplatePromise.md

📄 createUnrefFn.md

📄 extendRef.md

📄 from.md

📄 get.md

📄 injectLocal.md

📄 isDefined.md

📄 logicAnd.md

📄 logicNot.md

📄 logicOr.md

📄 makeDestructurable.md

📄 onClickOutside.md

📄 onElementRemoval.md

📄 onKeyStroke.md

📄 onLongPress.md

📄 onStartTyping.md

📄 provideLocal.md

📄 reactify.md

📄 reactifyObject.md

📄 reactiveComputed.md

📄 reactiveOmit.md

📄 reactivePick.md

📄 refAutoReset.md

📄 refDebounced.md

📄 refDefault.md

📄 refManualReset.md

📄 refThrottled.md

📄 refWithControl.md

📄 set.md

📄 syncRef.md

📄 syncRefs.md

📄 templateRef.md

📄 toObserver.md

📄 toReactive.md

📄 toRef.md

📄 toRefs.md

📄 tryOnBeforeMount.md

📄 tryOnBeforeUnmount.md

📄 tryOnMounted.md

📄 tryOnScopeDispose.md

📄 tryOnUnmounted.md

📄 unrefElement.md

📄 until.md

📄 useAbs.md

📄 useActiveElement.md

📄 useAnimate.md

📄 useArrayDifference.md

📄 useArrayEvery.md

📄 useArrayFilter.md

📄 useArrayFind.md

📄 useArrayFindIndex.md

📄 useArrayFindLast.md

📄 useArrayIncludes.md

📄 useArrayJoin.md

📄 useArrayMap.md

📄 useArrayReduce.md

📄 useArraySome.md

📄 useArrayUnique.md

📄 useAsyncQueue.md

📄 useAsyncState.md

📄 useAsyncValidator.md

📄 useAuth.md

📄 useAverage.md

📄 useAxios.md

📄 useBase64.md

📄 useBattery.md

📄 useBluetooth.md

📄 useBreakpoints.md

📄 useBroadcastChannel.md

📄 useBrowserLocation.md

📄 useCached.md

📄 useCeil.md

📄 useChangeCase.md

📄 useClamp.md

📄 useClipboard.md

📄 useClipboardItems.md

📄 useCloned.md

📄 useColorMode.md

📄 useConfirmDialog.md

📄 useCookies.md

📄 useCountdown.md

📄 useCounter.md

📄 useCssVar.md

📄 useCurrentElement.md

📄 useCycleList.md

📄 useDark.md

📄 useDateFormat.md

📄 useDebouncedRefHistory.md

📄 useDebounceFn.md

📄 useDeviceMotion.md

📄 useDeviceOrientation.md

📄 useDevicePixelRatio.md

📄 useDevicesList.md

📄 useDisplayMedia.md

📄 useDocumentVisibility.md

📄 useDraggable.md

📄 useDrauu.md

📄 useDropZone.md

📄 useElementBounding.md

📄 useElementByPoint.md

📄 useElementHover.md

📄 useElementSize.md

📄 useElementVisibility.md

📄 useEventBus.md

📄 useEventListener.md

📄 useEventSource.md

📄 useExtractedObservable.md

📄 useEyeDropper.md

📄 useFavicon.md

📄 useFetch.md

📄 useFileDialog.md

📄 useFileSystemAccess.md

📄 useFirestore.md

📄 useFloor.md

📄 useFocus.md

📄 useFocusTrap.md

📄 useFocusWithin.md

📄 useFps.md

📄 useFullscreen.md

📄 useFuse.md

📄 useGamepad.md

📄 useGeolocation.md

📄 useIDBKeyval.md

📄 useIdle.md

📄 useImage.md

📄 useInfiniteScroll.md

📄 useIntersectionObserver.md

📄 useInterval.md

📄 useIntervalFn.md

📄 useIpcRenderer.md

📄 useIpcRendererInvoke.md

📄 useIpcRendererOn.md

📄 useJwt.md

📄 useKeyModifier.md

📄 useLastChanged.md

📄 useLocalStorage.md

📄 useMagicKeys.md

📄 useManualRefHistory.md

📄 useMath.md

📄 useMax.md

📄 useMediaControls.md

📄 useMediaQuery.md

📄 useMemoize.md

📄 useMemory.md

📄 useMin.md

📄 useMounted.md

📄 useMouse.md

📄 useMouseInElement.md

📄 useMousePressed.md

📄 useMutationObserver.md

📄 useNavigatorLanguage.md

📄 useNetwork.md

📄 useNow.md

📄 useNProgress.md

📄 useObjectUrl.md

📄 useObservable.md

📄 useOffsetPagination.md

📄 useOnline.md

📄 usePageLeave.md

📄 useParallax.md

📄 useParentElement.md

📄 usePerformanceObserver.md

📄 usePermission.md

📄 usePointer.md

📄 usePointerLock.md

📄 usePointerSwipe.md

📄 usePrecision.md

📄 usePreferredColorScheme.md

📄 usePreferredContrast.md

📄 usePreferredDark.md

📄 usePreferredLanguages.md

📄 usePreferredReducedMotion.md

📄 usePreferredReducedTransparency.md

📄 usePrevious.md

📄 useProjection.md

📄 useQRCode.md

📄 useRafFn.md

📄 useRefHistory.md

📄 useResizeObserver.md

📄 useRound.md

📄 useRouteHash.md

📄 useRouteParams.md

📄 useRouteQuery.md

📄 useRTDB.md

📄 useScreenOrientation.md

📄 useScreenSafeArea.md

📄 useScriptTag.md

📄 useScroll.md

📄 useScrollLock.md

📄 useSessionStorage.md

📄 useShare.md

📄 useSortable.md

📄 useSorted.md

📄 useSpeechRecognition.md

📄 useSpeechSynthesis.md

📄 useSSRWidth.md

📄 useStepper.md

📄 useStorage.md

📄 useStorageAsync.md

📄 useStyleTag.md

📄 useSubject.md

📄 useSubscription.md

📄 useSum.md

📄 useSupported.md

📄 useSwipe.md

📄 useTemplateRefsList.md

📄 useTextareaAutosize.md

📄 useTextDirection.md

📄 useTextSelection.md

📄 useThrottledRefHistory.md

📄 useThrottleFn.md

📄 useTimeAgo.md

📄 useTimeAgoIntl.md

📄 useTimeout.md

📄 useTimeoutFn.md

📄 useTimeoutPoll.md

📄 useTimestamp.md

📄 useTitle.md

📄 useToggle.md

📄 useToNumber.md

📄 useToString.md

📄 useTransition.md

📄 useTrunc.md

📄 useUrlSearchParams.md

📄 useUserMedia.md

📄 useVibrate.md

📄 useVirtualList.md

📄 useVModel.md

📄 useVModels.md

📄 useWakeLock.md

📄 useWebNotification.md

📄 useWebSocket.md

📄 useWebWorker.md

📄 useWebWorkerFn.md

📄 useWindowFocus.md

📄 useWindowScroll.md

📄 useWindowSize.md

📄 useZoomFactor.md

📄 useZoomLevel.md

📄 watchArray.md

📄 watchAtMost.md

📄 watchDebounced.md

📄 watchDeep.md

📄 watchExtractedObservable.md

📄 watchIgnorable.md

📄 watchImmediate.md

📄 watchOnce.md

📄 watchPausable.md

📄 watchThrottled.md

📄 watchTriggerable.md

📄 watchWithFilter.md

📄 whenever.md

📄 LICENSE.md

📄 SKILL.md

📄 SYNC.md