defineNuxtComponent

defineNuxtComponent() は、Options API を使用して型安全なコンポーネントを定義するためのヘルパー関数です。

defineNuxtComponent() は、defineComponent() に似た Options API を使用して型安全な Vue コンポーネントを定義するためのヘルパー関数です。defineNuxtComponent() ラッパーは、asyncData および head コンポーネントオプションのサポートも追加します。

<script setup lang="ts"> を使用することが、Nuxt で Vue コンポーネントを宣言する推奨方法です。

こちらも参照 getting-started > data-fetching

`asyncData()`

アプリで setup() を使用しない場合、コンポーネント定義内で asyncData() メソッドを使用できます:

app/pages/index.vue

export default defineNuxtComponent({
  async asyncData() {
    return {
      data: {
        greetings: 'hello world!'
      }
    }
  },
})

`head()`

アプリで setup() を使用しない場合、コンポーネント定義内で head() メソッドを使用できます:

app/pages/index.vue

export default defineNuxtComponent({
  head(nuxtApp) {
    return {
      title: 'My site'
    }
  },
})

※このページは Nuxt.js 公式ドキュメントの翻訳ページです。

公式ドキュメントの該当ページはこちら：
https://nuxt.com/docs/4.x/api/utils/define-nuxt-component