Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →vueuse/vueuse-functions
Apply VueUse composables where appropriate to build concise, maintainable Vue.js / Nuxt features.
Passed 22 of 23 test cases with the skill, and 19 of 23 without it.
3 fixed19 passed either way1 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 3 test cases the skill fixed. Same model, same prompt, with and without the skill.
I am writing a standard Vue 3 utility helper and need to read the current value of a ref variable inside a function. Should I replace my standard ref value access with the VueUse get helper function across the project?
| Checked | Without skill | With skill |
|---|---|---|
| Advises using standard ref.value property access rather than get(). | Passed | Passed |
| Explains that the get helper is intended only when explicitly requested by the user. | Missed | Passed |
The instructions your model reads when the skill loads.
This skill is a decision-and-implementation guide for VueUse composables in Vue.js / Nuxt projects. It maps requirements to the most suitable VueUse function, applies the correct usage pattern, and prefers composable-based solutions over bespoke code to keep implementations concise, maintainable, and performant.
Invocation field in the below functions table. For example:
AUTO: Use automatically when applicable.EXTERNAL: Use only if the user already installed the required external dependency; otherwise reconsider, and ask to install only if truly needed.EXPLICIT_ONLY: Use only when explicitly requested by the user.NOTE User instructions in the prompt or
AGENTS.mdmay override a function’s defaultInvocationrule.
All functions listed below are part of the VueUse library, each section categorizes functions based on their functionality.
IMPORTANT: Each function entry includes a short Description and a detailed Reference. When using any function, always consult the corresponding document in ./references for Usage details and Type Declarations.
| Function | Description | Invocation |
|---|---|---|
createGlobalState | Keep states in the global scope to be reusable across Vue instances | AUTO |
createInjectionState | Create global state that can be injected into components | AUTO |
createSharedComposable | Make a composable function usable with multiple Vue instances | AUTO |
injectLocal | Extended inject with ability to call provideLocal to provide the value in the same component | AUTO |
provideLocal | Extended provide with ability to call injectLocal to obtain the value in the same component | AUTO |
useAsyncState | Reactive async state | AUTO |
useDebouncedRefHistory | Shorthand for useRefHistory with debounced filter | AUTO |
useLastChanged | Records the timestamp of the last change | AUTO |
useLocalStorage | Reactive LocalStorage | AUTO |
useManualRefHistory | Manually track the change history of a ref when the user calls commit() | AUTO |
useRefHistory | Track the change history of a ref | AUTO |
useSessionStorage | Reactive SessionStorage | AUTO |
useStorage | Create a reactive ref that can be used to access & modify LocalStorage or SessionStorage | AUTO |
useStorageAsync | Reactive Storage with async support | AUTO |
test cases passed, vs 19 / 23 without
More skills from the same source and nearby in the registry, with their headline benchmark lift.