smastrom / notivue

🔔 Powerful toast notification system for Vue and Nuxt.
https://notivue.smastrom.io
MIT License
632 stars 7 forks source link

Need help with Nuxt 3 installation #2

Closed MogliCodes closed 1 year ago

MogliCodes commented 1 year ago

Hi there!

I saw your post on Reddit and immediately wanted to try out Notivue in a Nuxt 3 application. I followed the guidelines in the Nuxt 3 docs and added a plugin file:

plugins/notivue.client.js

import { notivue } from 'notivue'

import 'notivue/notifications.css'
import 'notivue/animations.css'

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(notivue).mount('#app')
})

Then I followed step 2 and 3 from your documentation. When I open the app in the browser I get this error:

Cannot read properties of undefined (reading 'push')

Some additional info about the Nuxt app:

------------------------------
- Operating System: `Darwin`
- Node Version:     `v18.15.0`
- Nuxt Version:     `3.2.2`
- Nitro Version:    `2.2.3`
- Package Manager:  `pnpm@8.2.0`
- Builder:          `vite`
- User Config:      `app`, `modules`, `supabase`, `pinia`
- Runtime Modules:  `@nuxtjs/tailwindcss@6.4.1`, `@nuxtjs/supabase@0.3.1`, `@pinia/nuxt@0.4.7`
- Build Modules:    `-`
------------------------------
smastrom commented 1 year ago

Hi Mogli, I suspect that you're not calling usePush in the setup function of your component as displayed in the Quick Start section.

<script setup>
import { usePush } from 'notivue'

const push = usePush()
</script>

I also think you are not following the Nuxt installation section from the official Notivue's documentation.

I've also created a working Nuxt 3 example using StackBlitz.

Please feel free to reopen this issue if you're still experiencing problems with Nuxt.