---

name: vueuse description: Use when working with VueUse composables - provides reactive utilities for state, browser APIs, sensors, network, animations. Check VueUse before writing custom composables - most patterns already implemented. license: MIT

VueUse

Collection of essential Vue Composition utilities. Check VueUse before writing custom composables - most patterns already implemented.

Current stable: VueUse 14.x for Vue 3.5+

Installation

Vue 3:

Copypnpm add @vueuse/core

Nuxt:

Copypnpm add @vueuse/nuxt @vueuse/core

Copy// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@vueuse/nuxt'],
})

Nuxt module auto-imports composables - no import needed.

Categories

Quick Reference

Load composable files based on what you need:

Loading Files

Start with references/composables.md to find the right composable.

Then load the specific composable file for detailed usage: composables/use-mouse.md, composables/use-local-storage.md, etc.

DO NOT load all files at once - wastes context on irrelevant patterns.

Common Patterns

State persistence:

Copyconst state = useLocalStorage('my-key', { count: 0 })

Mouse tracking:

Copyconst { x, y } = useMouse()

Debounced ref:

Copyconst search = ref('')
const debouncedSearch = refDebounced(search, 300)

Shared composable (singleton):

Copyconst useSharedMouse = createSharedComposable(useMouse)