应用程序主页面 app.vue

app.vue 文件是 Nuxt 3 应用程序中的主要组件。

最小使用

对于 Nuxt 3,pages/ 目录是可选的。

如果不存在,Nuxt 将不会包含 vue-router 依赖项。

这在处理着陆页或不需要路由的应用程序时很有用。

app.vue
vue
<template>
  <h1>Hello World!</h1>
</template>

Usage With Pages

如果你有一个 pages/ 目录,要显示当前页面,请使用 <NuxtPage> 组件:

app.vue
vue
<template>
  <div>
    <NuxtLayout>
      <NuxtPage />
    </NuxtLayout>
  </div>
</template>

由于 Nuxt 3 在 <NuxtPage> 中使用了 <Suspense>,因此不能将其设置为根元素。

请记住,app.vue 充当 Nuxt 应用程序的主要组件。 您添加到其中的任何内容(JS 和 CSS)都将是全局的并包含在每个页面中。

如果您希望能够在页面之间自定义页面周围的结构,请查看layouts/目录。