Почему не работает asyncData?

Question

[Дмитрий Баскаков]

Почему не работает asyncData в файле pages/index.vue?

<template>
{{name}}
</template>

<script>
export default {
  asyncData(context) {
    return { name: 'World' }
  }
}
</script>

nutx.config.ts

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
    css: ["@/assets/scss/main.scss"],
    modules: ['nuxt-icons'],
    app: {
        head: {
            htmlAttrs: {
                lang: 'ru'
            }
        },
    },
    vite: {
        css: {
            preprocessorOptions: {
                scss: {
                    additionalData: '@use "@/assets/scss/variables/_colors.scss" as *; @use "@/assets/scss/variables/_breakpoints.scss" as *;'
                }
            }
        }
    }

})

package.json

{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "nuxt": "3.0.0",
    "sass": "^1.57.1",
    "sass-loader": "^10.4.1"
  },
  "dependencies": {
    "nuxt-icons": "^3.0.0"
  }
}

layout/default.vue

<template>
  <AppHeader/>
  <slot />
  <AppFooter/>
</template>

<script>
import AppHeader from "~/components/AppHeader/AppHeader.vue";
import AppFooter from "~/components/AppFooter/AppFooter.vue";

export default {
  name: "default",
  components: {AppFooter, AppHeader}
}
</script>

<style scoped>

</style>