`defineProps()`

Declares typed component props inside <script setup>.

Since Vue 3.0 Spec ↗

Syntax

const props = defineProps<Props>()

Parameters

Name	Type	Required	Description
`declaration`	`type \| object`	No	Type argument or runtime props options object.

Returns

object — A reactive readonly props object.

Examples

<script setup lang="ts">
const props = defineProps<{
  title: string;
  count?: number;
}>();
</script>

<template><h2>{{ props.title }} ({{ count }})</h2></template>

<script setup lang="ts">
const { title, count = 0 } = defineProps<{
  title: string;
  count?: number;
}>();
</script>

Notes

defineProps is a compiler macro; no import is needed and it must be called at the top level of `<script setup>`. Use the type-based form for full TS inference. Since Vue 3.5 destructured props remain reactive and default values are written with normal JS defaults.