Introduction

CodeSandbox for this example.

yarn add @vueuse/motion

Plugin Installation

If you are planning on using the directives (v-motion) from this package, you might want to add the plugin to your Vue instance.

You can add the support for v-motion globally, by installing the plugin.

import { MotionPlugin } from '@vueuse/motion'

const app = createApp(App)

app.use(MotionPlugin)

app.mount('#app')

If you want to import the directive code only from components that uses it, import the directive and install it at component level.

import { directive as motion } from '@vueuse/motion'

export default {
  directives: {
    motion: motion(),
  },
}