nuxt-bezier
Nuxt Bezier
This module integrates the @noction/vue-bezier component with Nuxt 3.
Demo
Install
npx nuxi@latest module add nuxt-bezier
Usage
Install
For integration is enough to add it into your nuxt.config.ts:
export default {
modules: [
'nuxt-bezier'
]
}
It will also import the necessary styles automatically.
Config
For configuration, use nuxtBezier key. There you can configure prefix and components options. Both of them are optional.
- prefix - the value to prepend to the nuxtBezier components
- components - specific transition components which should be mounted. By default, all of them are added.
Configuration example:
export default {
nuxtBezier: {
prefix: 'Prefix',
components: ['FadeTransition']
}
}
Appliance
Now, you’re ready to use the transition components in your app. Here is a basic example.
<template>
<fade-transition>
<p v-show="show">Fade transition</p>
</fade-transition>
</template>
<script setup>
const show = ref(true)
</script>
Reference
For more information about all available Props, please check the vue-bezier module, since this one only a wrapper for its integration in Nuxt3.
License
MIT © 50rayn