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

[Eronne]

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!:

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]

Hi,

Firstly, you need to use component in template and please see my comment;
#15 (comment)

Best Regards,