betterDefine ​

With enabling betterDefine, imported types are supported in <script setup> type-based-macros.

Related issue

Basic Usage ​

<script setup lang="ts">
import { type BaseProps } from './types'

interface Props extends BaseProps {
  foo: string
}
defineProps<Props>()
</script>

export interface BaseProps {
  title: string
}

⚠️ Limitations ​

Complex types ​

Complex types are not supported in some key places. For example:

What are Complex Types? ​

• All utility types
  • Built-in types
  • All types from type-fest package.
  • typeof keyword.
  • ...
• Index Signature
  ts

  interface Type {
    [key: string]: string
  }

• Generics will be ignored directly

What are Key Places? ​

• The names of props.

// ✅
defineProps<{
  foo: ComplexType
}>()

// ❌
defineProps<{
  [ComplexType]: string
}>()

• The names of emits.

interface Emits {
  (event: 'something', value: ComplexType): void // ✅
  (event: ComplexType): void // ❌
}