vueuse

Use when working with VueUse composables - track mouse position with useMouse, manage localStorage with useStorage, detect network status with useNetwork, debounce values with refDebounced, and access browser APIs reactively. Check VueUse before writing custom composables - most patterns already implemented.

Quality

92%

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Securityby

Failed to scan

The risk profile of this skill

Evaluation results

88%

10%

Setting Up Reactive Utilities in a Nuxt Application

Nuxt VueUse setup and configuration

Criteria

Without context

With context

@vueuse/nuxt dependency

100%

@vueuse/core dependency

100%

VueUse 14.x version

100%

Nuxt module registered

100%

No manual VueUse imports

100%

useMouse used

100%

useLocalStorage/useStorage used

100%

useNetwork used

100%

Auto-import explanation

100%

pnpm install command

100%

30%

Building an SSR-Compatible Dashboard Widget

SSR-safe browser API composable usage

Criteria

Without context

With context

isClient guard present

100%

onMounted guard present

100%

Two distinct patterns used

100%

isClient imported from @vueuse/core

100%

SSR-safe composable used directly

100%

No bare window/document access

100%

SSR_NOTES lists safe composables

100%

SSR_NOTES lists guarded composables

100%

Imports from @vueuse/core

100%

Reactive data displayed

100%

25%

Responsive Layout with Reusable Cursor Tracking

Component ref element targeting and shared composables

Criteria

Without context

With context

createSharedComposable used

100%

Correct import for createSharedComposable

100%

unrefElement used OR .$el accessed

100%

cardRef not passed directly

100%

useElementSize used

100%

useSharedMouse used in overlay

100%

Overlay renders all four values

100%

Explains why direct ref fails

100%

Explains shared listener benefit

70%

100%

Repository: onmax/nuxt-skills
Commit: 00fb59d

Evaluated: about 1 month ago
Agent: Claude Code
Model: Claude Sonnet 4.6

Table of Contents

Setting Up Reactive Utilities in a Nuxt Application Building an SSR-Compatible Dashboard Widget Responsive Layout with Reusable Cursor Tracking

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.