Errors typing props using interface in Vue 3 (Vue: Untyped function calls may not accept type arguments.)

Question

I want to type props using an interface, this is my code and works correctly. But:

defineProps<Props>();

Is highlighted with this error (Vue: Untyped function calls may not accept type arguments.)

<script setup lang="ts">
import type { Client } from "@/clients/interfaces/client.interface";

interface Props {
  clients: Client[];
}

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

Reading and searching i tryed to configure .eslintrc with

  env: {
    'vue/setup-compiler-macros': true
  }

and installing "@vue/eslint-config-typescript": "^12.0.0"

I'm using webStorm, i don't know if it's relevant. Thanks for help

Answer 1

According to the documentation, the syntax used in the problem description is correct, but ESLint doesn't like it.

Solution I implemented: One of the other options in the documentation, e.g. from code:

<script setup lang="ts">
interface Book {
  title: string
  author: string
  year: number
}

const props = defineProps<{
  book: Book
}>()
</script>

This way, I don't get the ESLint error, I can declare the prop type with the corresponding interface and without the verbosity of declaring each prop with its type and require, etc.

Answer 2

In my case, the IDE settings pointed to wrong Typescript. Just ensure that the TypeScript setting of the IDE points to the correct version: