Question

I m developing a component for my Nuxt 3 project. I m trying to declare an interface to provide strong typings for the component props, e.g.:

<script setup>
interface Props {
  float: number;
}

const props = defineProps<Props>();
</script>

然而,VS 在我试图这样做时,《刑法》显示错误:

 interface  declarations can only be used in TypeScript files. ts(8006)

我还注意到,我试图使用任何类型的说明(例如:let x:string):

Type annotations can only be used in TypeScript files. ts(8010)

I could > useîtime declaration syntax for the props - e.g:

const props = defineProps({
  float: { type: Number, required: true },
});

但是,我只使用Typegust syntax,因为我希望能够使整个项目的安全性和节点。

What I ve tried

我采取了标准步骤,使VS法典中的Vue案的Syntax能够:

I have Volar installed;
I also disabled the built-in TypeScript VS Code extension for the workspace in order to enable Takeover mode. The (takeover) label shows up in the status bar, indicating that it s working.

但它没有工作。我试图重新启用Volar Vue服务器,甚至完全重新启用《科索沃法典》,但错误依然存在。什么可能会造成错误出现?

Answer 1

Argh, noob mis - I forgot to provide the lang="tsvide to the scripttag:

<script setup lang="ts">
interface Props {
  float: number;
}

const props = defineProps<Props>();
</script>

After adding lang="ts", the problem is gone.

The most frustrating thing is that nowhere it s hinted from VS Code that its absence could be the cause of the errors and it looks as if Volar is simply not taking over. I only noticed it after taking another look at the docs.

What I ve tried

友情链接