Collection of essential Vue Composition Utilities
- πͺ Interactive docs & demos
- β‘ Fully tree shakeable: Only take what you want, bundle size
- π¦Ύ Type Strong: Written in TypeScript, with TS Docs
- π SSR Friendly
- π No bundler required: Usable via CDN
- π© Flexible: Configurable event filters and targets
- π Optional Add-ons: Router, Firebase, RxJS, etc.
import { useLocalStorage, useMouse, usePreferredDark } from '@vueuse/core'
const { x, y } = useMouse()
// if user prefers dark theme
const isDark = usePreferredDark()
// persist state in localStorage
const store = useLocalStorage(
'my-storage',
{
name: 'Apple',
color: 'red',
},
)
Refer to functions list or documentations for more details.
From v12.0, VueUse no longer supports Vue 2. Please use v11.x for Vue 2 support.
npm i @vueuse/core
<script src="https://unpkg.com/@vueuse/shared"></script>
<script src="https://unpkg.com/@vueuse/core"></script>
It will be exposed to global as window.VueUse
See the Contributing Guide
This project is heavily inspired by the following awesome projects.
And thanks to all the contributors on !
MIT License Β© 2019-PRESENT Anthony Fu