Nuxt3: script setup cannot redeclare block-scoped variable

user_7164957 0
Viewed 93

When declaring variables

<script lang="ts" setup>
    const id = "foo"
</script>

TS warns Cannot redeclare block-scoped variable 'id'. I am declaring this variable in each component that needs an ID

How to solve it ?

nuxt3 nuxt.js typescript
2 Answers

Aloha, if you are using VS Code, check to see if you are using the Vetur extension. If you are I would recommend removing Vetur and installing Vue Language Features (Volar).

I faced the same issue and after removing the Vetur extension and using Volar, the error doesn't appear.

Also if you add an import statement into the file, the error will disappear.

It seems that this error stems from Vetur's interpretation of Typescript's method of determining what a module is; if a top level import or export is present.

user_192942390

The easiest fix for me (using Vue) was to add an import for a function I was using for defineEmits like:

import { defineEmits } from "vue";

note: originally it wasn't required thanks to unplugin-vue-components but adding it got rid of the error.

if that doesn't fix it for you (or doesn't apply), you can try manually importing something else you may already be using, even though it's not required.

user_3424970
Related