ref type wrong

if i do
const count = ref(1)
const count = ref(1)
vscode shows the type as
globalThis.Ref<number, number>
globalThis.Ref<number, number>
why?
2 Replies
kapa.ai
kapa.ai4w ago
Hi @pearbender. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- When you use Nuxt 3 (or Vue 3) and write:
const count = ref(1)
const count = ref(1)
VSCode may show the type as:
globalThis.Ref<number, number>
globalThis.Ref<number, number>
This is expected and comes from the way Nuxt (and Vue) types the ref function. The type globalThis.Ref<number, number> is a global type definition for a ref that holds a number. The first type parameter is the value type (number), and the second is the initial value type (also number in this case). This is part of the type system that Nuxt and Vue use to provide strong typing and auto-completion in your IDE. Nuxt auto-imports Vue's reactivity APIs like ref, and preserves typings and IDE completions, so you can use them directly without explicit imports. The type you see is just the full, explicit type as defined globally by the framework for refs, and is normal in this context. You can safely use count as a ref<number> in your code, and the type will work as expected for reactivity and template unwrapping in Nuxt 3 and Vue 3 environments Auto-imports in Nuxt. If you encounter any issues with type inference or auto-imports, it's usually due to your IDE's TypeScript setup or extensions, but the type globalThis.Ref<number, number> itself is not a problem. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai4w ago
<@779279431419559947> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Did you find this page helpful?