Skip to content

Type definitions are incorrect when importing useAsyncData from #imports #233

Closed
@cjpearson

Description

@cjpearson

Environment


  • Operating System: Darwin
  • Node Version: v20.9.0
  • Nuxt Version: 3.10.3
  • CLI Version: 3.10.1
  • Nitro Version: 2.9.1
  • Package Manager: [email protected]
  • Builder: -
  • User Config: -
  • Runtime Modules: -
  • Build Modules: -

Reproduction

The issue can be reproduced by adding this sample composable to the starter nuxt module. e.g. npx nuxi init -t module quick-test

src/runtime/composables/useHelloWorld.ts

import { useAsyncData } from '#imports'

export async function useHelloWorld() {
  const {
    data,
  } = await useAsyncData(
    'use-hello-world',
    () => Promise.resolve({ hello: 'world'}),
  )

  return {
    data,
  }
}

Run yarn nuxt-module-build build && cat dist/runtime/composables/useHelloWorld.d.ts which produces the following output:

export declare function useHelloWorld(): Promise<{
    data: any;
}>;

If the import is changed to use nuxt/app, the output is correct:

export declare function useHelloWorld(): Promise<{
    data: import("vue").Ref<{
        hello: string;
    } | null>;
}>;

Describe the bug

When using useAsyncData inside a module, the compiled type definitions are incorrect if useAsyncData is imported from #imports. Changing the import to import { useAsyncData } from 'nuxt/app' resolves the issue, but my understanding is that '#imports' is preferred.

Additional context

No response

Logs

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions