typescript Nuxt 3 useNuxtApp()返回未知类型

vngu2lb8  于 2023-04-13  发布在  TypeScript
关注(0)|答案(2)|浏览(421)

我尝试提供一个帮助器,可以在Nuxt插件中的所有可组合项和应用程序中使用,代码如下所示:

// hello.ts
export default defineNuxtPlugin(async nuxtApp => {

  nuxtApp.vueApp.provide('hello', (name: string) => `Hello ${name}!`);
  nuxtApp.provide('hello', (name: string) => `Hello ${name}!`)

});

之后,我尝试在composable中使用useNuxtApp()来调用helper,如下所示,然而,useNuxtApp()`返回的类型是未知的。

// useHello.ts
export default async function() {
    const nuxtApp = useNuxtApp()
    console.log(nuxtApp.$hello('name'))
}

我得到的错误是nuxtApp.$hello' is of type 'unknown'.
我跟踪了documentation,我不明白为什么它返回类型未知。
我错过了什么吗?也许在nuxt.config.ts中?
我真的很感激你的帮助。

xfyts7mz

xfyts7mz1#

我有同样的问题。我添加以下到我的打字文件(如我的.d.ts),它的resloved。

declare function useNuxtApp(): NuxtApp;
k4emjkb1

k4emjkb12#

因为你想从一个plugin提供helper(hello),你可以返回一个带有provide键的对象,就像这里提到的:
如果你想在NuxtApp示例上提供一个helper,请在provide键下从插件返回它。例如:

export default defineNuxtPlugin(() => {
 return {
     provide: {
         hello: (msg: string) => `Hello ${msg}!`
     }
 }
})

我还想提一下,Nuxt 3使用utils/目录,通过自动导入(Nuxt3 Utils/)在整个应用程序中自动导入助手函数和其他实用程序。

相关问题