defineComponent() Component Definition Helper

Last updated: 2026-10-22

defineComponent() Component Definition Helper

defineComponent() is a typing helper — mainly for precise TypeScript inference; at runtime it behaves like a plain object.

📝 Syntax

import { defineComponent } from "vue"
export default defineComponent({
  props: { msg: String },
  setup(props) { return { upper: props.msg.toUpperCase() } }
})

⚙️ Arguments

Returns：The same object (typed)

▶ Example

Edit the code below and see the live result:

Output：

Shows uppercase VUE.

💡 Key Points