我想知道如何在<script setup>模式下定义name和components。在none <script setup模式下，我可以执行以下操作：

export default {
name: 'App',
props: ['foo','greetingMessage'],
components: {
    HelloWorld
},

我如何才能实现同样的事情在<script setup>模式请

App.vue：

<template>
  <img alt="Vue logo" src="./assets/logo.png">
  <HelloWorld msg="Welcome to Your Vue.js App"/>
  <span>greetingMessage:{{ greetingMessage }}</span>
</template>

<script setup>
import HelloWorld from './components/HelloWorld.vue'
import {defineProps} from 'vue'

const props = defineProps(['foo','greetingMessage'])

name: 'App'
components: {
  HelloWorld
}

console.log("props:",props)
console.log("props.foo:",props.foo)
console.log("props.greetingMessage:",props.greetingMessage)

</script>