Vue 3.3, and generic components in script setup

A list component that takes items and a key, where the key must be a property of the item, was previously untypeable in a single-file component.

<script setup lang="ts" generic="T extends { id: string | number }">
defineProps<{
  items: T[]
  selected?: T
}>()

const emit = defineEmits<{ select: [item: T] }>()
</script>

The generic attribute is the piece that was missing, and it makes the emitted event carry the item type rather than any — which is where the errors were. The shorter emit syntax landed in the same release and is a genuine improvement in readability. Both are compile-time only, so the runtime is unchanged and the migration is per component.