app.vue
Файл app.vue — корневой компонент приложения Nuxt.
При наличии директории
app/pages/ файл app.vue необязателен. Nuxt подставит стандартный app.vue, но вы можете добавить свой для настройки структуры и содержимого.Использование
Минимальное использование
В Nuxt директория app/pages/ необязательна. Если её нет, зависимость vue-router не подключается. Удобно для лендингов и приложений без маршрутизации.
app/app.vue
<template>
<h1>Hello World!</h1>
</template>
Прочитайте и отредактируйте живой пример в Docs > 4 X > Examples > Hello World.
Использование со страницами
При наличии директории app/pages/ для отображения текущей страницы нужен компонент <NuxtPage>:
app/app.vue
<template>
<NuxtPage />
</template>
Общую структуру приложения можно задать прямо в app.vue — например, общий шапку и подвал:
app/app.vue
<template>
<header>
Содержимое шапки
</header>
<NuxtPage />
<footer>
Содержимое подвала
</footer>
</template>
app.vue — корневой компонент приложения Nuxt. Весь добавленный в него JS и CSS будет глобальным и попадёт на каждую страницу.Использование с лейаутами
Если разным страницам нужны разные лейауты, используйте директорию app/layouts/ и компонент <NuxtLayout>:
app/app.vue
<template>
<NuxtLayout>
<NuxtPage />
</NuxtLayout>
</template>