Nuxt•2d ago

No intellisense for props/properties/attributes

Fresh new project, no intellisense for custom or nuxt components /components/Tester.vue

<script setup lang="ts">
defineProps<{
    foobar: string;
}>();
</script>
<template>
    <div>{{ foobar }}</div>
</template>

<script setup lang="ts">
defineProps<{
    foobar: string;
}>();
</script>
<template>
    <div>{{ foobar }}</div>
</template>

7 Replies

kapa.ai•2d ago

Hi @Jonas. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- It looks like your props aren’t being picked up by IntelliSense. Here are the Nuxt-specific checks/fixes from the sources: - Ensure the SFC uses TypeScript: add lang="ts" on script setup (missing this causes TS/IntelliSense to fail) (Getting intellisense errors…).
- Run nuxt dev at least once so Nuxt generates .nuxt/nuxt.d.ts and tsconfig files that power type hints and auto-imports (Auto-generated Types).
- Don’t add custom include globs to tsconfig; Nuxt includes types by default. For global types, declare them in a .d.ts and export {} to mark as a module (How to Automatically Recognize Type Definitions…).
- If you opt into Nuxt 4 TypeScript project references, keep augmentations in app/, server/, or shared/ so the context picks them up (TypeScript Configuration Splitting, TypeScript (Auto-generated Types)).
- For IDE quirks: JetBrains IDEs had a bug resolving augmented globals; VS Code worked fine (Custom plugin… unknown type). Use VS Code with Volar (takeover mode) for best results. Given your example, also ensure: - The prop name matches usage. You defined foobar but used <Tester foo />. Use <Tester foobar="…" /> or change the prop name.
- Using defineProps in script setup exposes the prop to the template directly, so {{ foobar }} is correct once the name matches. If after this you still lack IntelliSense for Nuxt components, make sure nuxt dev is running so .nuxt types are generated, and your editor is using those generated tsconfig files (Nuxt handles this automatically) (Auto-generated Types). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2d ago

<@131685255852589056> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

JonasOP•2d ago

JonasOP•2d ago

didnt help

Cake•this hour

do you have .nuxt folder?

JonasOP•this hour

Yes

flapili•23h ago

did you add typescript as dep ? I saw that pnpm with typescript as only transitive deps doesn't work well, but if pnpm i -D typescript that's fine , hoisting all deps is also ok for vscode (but not a good practice)

Gaming

Programming

No intellisense for props/properties/attributes

Did you find this page helpful?