Get Started

VueUse is a collection of utility functions based on Composition API. We assume you are already familiar with the basic ideas of Composition API before you continue.


🎩 From v4.0, it works for Vue 2 & 3 within a single package by the power of Vue Demi!


npm i @vueuse/core # yarn add @vueuse/core

Vue 3 Demo: Vite, Webpack / Vue 2 Demo: Vue CLI


<script src=""></script>
<script src=""></script>

It will be exposed to global as window.VueUse

Usage Example

Simply importing the functions you need from @vueuse/core

import { useMouse, usePreferredDark, useLocalStorage } from '@vueuse/core'

export default {
  setup() {
    // tracks mouse position
    const { x, y } = useMouse()

    // is user prefers dark theme
    const isDark = usePreferredDark()

    // persist state in localStorage
    const store = useLocalStorage(
        name: 'Apple',
        color: 'red',

    return { x, y, isDark, store }

Refer to functions list for more details.