primefaces / primevue-nuxt-module

MIT License
70 stars 11 forks source link

`No PrimeVue Toast provided!` when configuring primevue from a Nuxt layer #27

Closed Eronne closed 8 months ago

Eronne commented 8 months ago

I have a Nuxt 3 layer that provides a default.vue layout like this example:

<script lang="ts" setup>
const toast = useToast();

const test = () => {
  toast.add({
    severity: "success",
    summary: "Success Message",
    detail: "Order submitted",
    life: 3000,
  });
}
</script>

<template>
  <Button label="test" @click="test" />
  <slot />
</template>

When working on the Nuxt 3 layer playground, everything works well. My toasts are appearing correctly.


But when I basically extend this Nuxt 3 layer to another new Nuxt 3 application, I have this 500 error saying that No PrimeVue Toast provided!: image

Here is my primevue configuration in my nuxt.config:

export default defineNuxtConfig({
  // ...
  primevue: {
    usePrimeVue: true,
    components: {
      include: [
        // ...
      ]
    }
  },
  // ...
});

It seems that the Primevue instance is not detected correctly? 🤔 I also have the error if I use it in pages / components directly.

I should point out that if I remove the useToast, everything works correctly. Thanks a lot for your work!

mertsincan commented 8 months ago

Hi,

Firstly, you need to use component in template and please see my comment; https://github.com/primefaces/primevue-nuxt-module/issues/15#issuecomment-1824365917

Best Regards,