Need help with vueuse?
Click the β€œchat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

antfu
2.1K Stars 111 Forks MIT License 639 Commits 2 Opened issues

Description

🧰 Collection of essential Vue Composition Utilities for Vue 2 and 3

Services available

!
?

Need anything else?

Contributors list

VueUse - Collection of essential Vue Composition Utilities
Collection of essential Vue Composition Utilities

NPM version NPM Downloads Storybook Demos Function Count
GitHub stars

πŸš€ Features

  • ⚑ Fully tree shakable: Only take what you want, bundle size
  • 🦾 Type Strong: Written in Typescript, with TS Docs
  • πŸ•Ά Seamless migration: Works for both Vue 3 and 2
  • πŸ”© Flexible: Configurable event filters
  • 🌎 No bundler required: Usable it via CDN
  • πŸ”‹ SSR Friendly
  • πŸŽͺ Interactive docs & demos: Check out the Storybook!
  • πŸ”Œ Optional Add-ons: Router, Firebase, RxJS, etc.

πŸ¦„ Usage

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(
  'my-storage', 
  {
    name: 'Apple',
    color: 'red',
  },
)

return { x, y, isDark, store }

} })

Refer to functions list or documentations for more details.

πŸ“¦ Install

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

npm i @vueuse/core

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

CDN


It will be exposed to global as

window.VueUse

⚑ Functions

You can check out the full documents and live demos in Storybook.

More functions to be added. Please stay tuned. (PRs are also welcome!)

Meanwhile, try also vue-composable by @pikax!

πŸ”Œ Add-ons

The core package aims to be lightweight and dependence free. While the add-ons are wrapping popular packages into the consistent API style.

🧱 Contribute

See the Contributing Guide

🌸 Thanks

This project is heavily inspired by the following awesome projects.

Thanks!

πŸ‘¨β€πŸš€ Contributors

Code Contributors

This project exists thanks to all the people who contribute. How to Contribute.

Financial Contributors

Become a financial contributor and help us sustain our community. Contribute via Open Collective

Individuals

Organizations

Support this project with your organization. Your logo will show up here with a link to your website. [Contribute]

πŸ“„ License

MIT License Β© 2019-2020 Anthony Fu

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.