eshimischi / vueuse

Collection of essential Vue Composition Utilities for Vue 2 and 3

Home Page:https://vueuse.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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

NPM version NPM Downloads Docs & Demos Function Count
GitHub stars

πŸš€ Features

  • πŸŽͺ Interactive docs & demos
  • πŸ•Ά Seamless migration: Works for both Vue 3 and 2
  • ⚑ 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.

πŸ¦„ Usage

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

export default {
  setup() {
    // tracks mouse position
    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',
      },
    )

    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

Add ons | Nuxt Module

From v6.0, VueUse requires vue >= v3.2 or @vue/composition-api >= v1.1

Demos

CDN

<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

πŸͺ΄ Project Activity

Alt

🧱 Contribute

See the Contributing Guide

🌸 Thanks

This project is heavily inspired by the following awesome projects.

And thanks to all the contributors on GitHub!

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

Financial Contributors on Open Collective

πŸ“„ License

MIT License Β© 2019-PRESENT Anthony Fu

About

Collection of essential Vue Composition Utilities for Vue 2 and 3

https://vueuse.org

License:MIT License


Languages

Language:TypeScript 84.3%Language:Vue 14.8%Language:CSS 0.6%Language:JavaScript 0.3%Language:HTML 0.0%Language:Shell 0.0%