ConfirmationService: Not working w/ Nuxt.js v3 || How to do so?

[ArnavK-09]

Describe the bug

import ConfirmationService from "primevue/confirmationservice";

export default defineNuxtPlugin((app) => {
  app.vueApp.use(ConfirmationService);
});

Reproducer

import { useConfirm } from "primevue/useconfirm"; const CNF = useConfirm(); CNF.require({ message: "Are you sure you want to proceed?", });

PrimeVue version

latest

Vue version

3.x

Language

TypeScript

Build / Runtime

Nuxt

Browser(s)

Edge

Steps to reproduce the behavior

No response

Expected behavior

import { useConfirm } from "primevue/useconfirm";

const CNF = useConfirm();
CNF.require({
  message: "Are you sure you want to proceed?"
});

should work and show dialog

[joemaylor]

1. Are you rendering <ConfirmDialog> component in your template?
2. Are you using the Nuxt module? If you are, you don't need your own plugin for the confirmation service. You can just do in your nuxt.config.ts:

export default defineNuxtConfig({
  modules: ['nuxt-primevue'],
  primevue: { composables: { include: ['useConfirm'] } }
})

[ArnavK-09]

whats wrong its not working mate

[ArnavK-09]

@joemaylor 🥲

[JasonLandbridge]

What I think fixed it for me was the following:

// nuxt.config.ts
  primevue: {
    options: {
      ripple: true,
    },
    directives: {
      include: '*', // Set this to import all
    },
    composables: { 
      include: '*', // Set this to import all
    },
  },

[ArnavK-09]

[ArnavK-09]

:/ i tried that way

[ArnavK-09]

But didn't worked