如何在Nuxt 3中正确使用vue-vimeo-player组件？

我尝试在Nuxt 3中集成vue-vimeo-player包，但始终无法成功运行。以下是我尝试过的两种方案及对应的报错信息：

方案一：插件注册方式 #

插件文件代码（plugins/vimeo.client.js） #

import VueVimeoPlayer from "vue-vimeo-player"

export default defineNuxtPlugin((nuxtApp ) => {

  nuxtApp.vueApp.use(VueVimeoPlayer)
  
  return {
    provide: {
      VueVimeoPlayer
    }
  }
})

组件文件代码（components/Video.vue） #

<script setup>

  const props = defineProps({
    entry: {
      type: Object,
    }
  })

  const { VueVimeoPlayer } = useNuxtApp()

</script>

<template>
  <div>
    <client-only>
      <VueVimeoPlayer :video-id="entry.vimeoVideoId" />
    </client-only>
  </div>
</template>

执行报错结果 #

[Vue warn]: Invalid vnode type when creating vnode: undefined. 
  at <ClientOnly> 
  at <Video entry= {vimeoVideoId: '547345908'} > 
  at <ContentPage slug="test-page" > 
  at <[slug] onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< Proxy(Object) {__v_skip: true} > > 
  at <RouteProvider key="/test-page" routeProps= {Component: {…}, route: {…}} pageKey="/test-page"  ... > 
  at <BaseTransition onAfterLeave= [ƒ] mode="out-in" appear=false  ... > 
  at <Transition onAfterLeave= [ƒ] name="page" mode="out-in" > 
  at <RouterView name=undefined route=undefined > 
  at <NuxtPage> 
  at <App key=2 > 
  at <NuxtRoot>

方案二：直接导入组件方式 #

组件文件代码（components/Video.vue） #

<script setup>

  import VueVimeoPlayer from "vue-vimeo-player"

  const props = defineProps({
    entry: {
      type: Object,
    }
  })

  const Vimeo = resolveComponent(VueVimeoPlayer)

</script>

<template>
  <div>
    <client-only>
      <Vimeo :video-id="entry.vimeoVideoId" />
    </client-only>
  </div>
</template>

执行报错结果 #

chunk-3NMN3MUW.js?v=ab1f30af:1381 [Vue warn]: Unhandled error during execution of setup function 
  at <Video entry= {vimeoVideoId: '547345908'} > 
  at <ContentPage slug="test-page" > 
  at <[slug] onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouteProvider key="/test-page" routeProps= {Component: {…}, route: {…}}Component: {__v_isVNode: true, __v_skip: true, type: {…}, props: {…}, key: null, …}route: {fullPath: '/test-page', hash: '', query: {…}, name: 'app-section-slug', path: '/test-page', …}[[Prototype]]: Object pageKey="/test-page"  ... > 
  at <BaseTransition onAfterLeave= [ƒ] mode="out-in" appear=false  ... > 
  at <Transition onAfterLeave= [ƒ] name="page" mode="out-in" > 
  at <RouterView name=undefined route=undefined > 
  at <NuxtPage> 
  at <App key=2 > 
  at <NuxtRoot>

chunk-3NMN3MUW.js?v=ab1f30af:213 Uncaught (in promise) TypeError: str.replace is not a function
    at chunk-3NMN3MUW.js?v=ab1f30af:213:1
    at chunk-3NMN3MUW.js?v=ab1f30af:208:1
    at resolve (chunk-3NMN3MUW.js?v=ab1f30af:3899:1)
    at resolveAsset (chunk-3NMN3MUW.js?v=ab1f30af:3883:1)
    at resolveComponent (chunk-3NMN3MUW.js?v=ab1f30af:3852:1)
    at setup (Test.vue:11:1)
    at callWithErrorHandling (chunk-3NMN3MUW.js?v=ab1f30af:1580:1)
    at setupStatefulComponent (chunk-3NMN3MUW.js?v=ab1f30af:7383:1)
    at setupComponent (chunk-3NMN3MUW.js?v=ab1f30af:7346:1)
    at mountComponent (chunk-3NMN3MUW.js?v=ab1f30af:6033:1)

请问我的操作哪里出现了问题？

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