This is module @kyvg/vue3-notification for Nuxt3
- Install
nuxt3-notifications
as project dependency:
npm install --save-dev nuxt3-notifications # npm
yarn add -D nuxt3-notifications # yarn classic
pnpm i -D nuxt3-notifications # pnpm
- Add it to the
modules
section of yournuxt.config
:
export default defineNuxtConfig({
modules: ['nuxt3-notifications'],
});
<!-- app.vue -->
<template>
<NuxtNotifications position="bottom left" :speed="500" />
</template>
<!-- page.vue/component.vue -->
<script setup>
const { notify } = useNotification();
function onClick() {
notify({
title: "Title",
text: "Hello notify!",
});
}
</script>
<template>
<button @click="onClick">Show notify</button>
</template>
export default defineNuxtConfig({
modules: ['nuxt3-notifications'],
nuxtNotifications: {
componentName: 'Foo' // 'foo-bar' or 'FooBar' for components of two or more words
},
});
- Fork and clone windx-foobar/nuxt3-notifications
- Enable corepack using corepack enable (use npm i -g corepack for Node.js < 16.10)
- Install dependencies using
pnpm install
- Run
pnpm dev:prepare
to generate type stubs. - Use
pnpm dev
to start playground in development mode.