aak-nuxt3-notifications

Nuxt3 Notifications Module

This is module aak-nuxt3-notifications for Nuxt3

📦 Get Started

1. Install aak-nuxt3-notifications as project dependency:

npm i aak-nuxt3-notifications # npm

yarn add aak-nuxt3-notifications # yarn

2. Add it to the modules section of your nuxt.config:

export default defineNuxtConfig({
  modules: [
    'aak-nuxt3-notifications',
  ],
})

🚀 Example

<!-- component.vue -->

<script setup>
  const { $notify } = useNuxtApp()

  const acceptsAnObject = () => $notify.info({ 
                                    title: 'Title message', 
                                    message: 'Text message', 
                                    position: 'bottom-right',
                                    duration: 8000
                                  })
  // ‎‧₊˚✧[Only text]✧˚₊‧
  const onlyText = () => $notify.info('You can only specify the text') 

  const info = () => $notify.info('An info-style message') // 💬
  const success = () => $notify.success('An success-style message') // ✅
  const warning = () => $notify.warning('An warning-style message') // ⚠️
  const error = () => $notify.error('An error-style message') // ❗
</script>

<template>
  <button @click="acceptsAnObject">Show notify acceptsAnObject</button>
  <button @click="onlyText">Show notify onlyText</button>
  <button @click="info">Show notify info</button>
  <button @click="success">Show notify success</button>
  <button @click="warning">Show notify warning</button>
  <button @click="error">Show notify error</button>
</template>

🔨 API

Options

💻 Development

• Fork and clone Azirafel17/nuxt3-notification-module
• Install dependencies using npm install
• Run npm dev:prepare to generate type stubs.
• Use npm dev to start playground in development mode.