Nuxt3集成vue-toastification插件遇undefined问题，求正确安装方法

修复插件注册逻辑 #

你当前的配置仅完成了Vue实例的注册，但未将Toast实例暴露给Nuxt上下文，导致useNuxtApp()无法获取。修改plugins/toast.js如下：

import Toast from "vue-toastification"
import "vue-toastification/dist/index.css"

export default defineNuxtPlugin((nuxtApp) => {
  // 注册Toast到Vue应用
  nuxtApp.vueApp.use(Toast, {
    // 可添加全局配置，例如：position: 'top-right', timeout: 3000
  })
  // 获取Toast核心实例方法
  const toast = Toast.useToast()
  // 将实例注入Nuxt上下文
  return {
    provide: {
      toast
    }
  }
})

组件内调用方式 #

在index.vue中，通过useNuxtApp()获取注入的$toast对象：

<script setup>
const { $toast } = useNuxtApp()
// 调用示例
$toast.success('操作完成')
$toast.warning('请注意相关事项')
$toast.error('操作失败')
</script>

可选：全局自动导入（无需每次调用useNuxtApp） #

在nuxt.config.ts中添加配置，让$toast全局可用：

export default defineNuxtConfig({
  plugins: ['~/plugins/toast'],
  imports: {
    globals: [
      {
        name: '$toast',
        from: '#app'
      }
    ]
  }
})

配置后，组件内可直接使用$toast方法，无需手动获取。

内容的提问来源于stack exchange，提问作者drake035