layers

Каталог layers/ для локальных слоёв с автоматической регистрацией.

Каталог layers/ помогает организовывать и переиспользовать код, компоненты, композаблы и конфигурацию в приложении Nuxt. Подкаталоги в layers/ регистрируются как слои автоматически.

Авторегистрация каталога layers/ доступна с Nuxt v3.12.0.
Слои удобны для крупных кодовых баз (DDD), UI-библиотек и тем, общих пресетов конфигурации, а также для разделения админки, фич и т.п.

Структура

Каждая подпапка в layers/ — отдельный слой. Внутри допустима та же структура, что и у обычного Nuxt-приложения.

У каждого слоя обязан быть nuxt.config.ts (даже пустой), иначе слой не распознаётся.
Directory structure
-| layers/
---| base/
-----| nuxt.config.ts
-----| app/
-------| components/
---------| BaseButton.vue
-------| composables/
---------| useBase.ts
-----| server/
-------| api/
---------| hello.ts
---| admin/
-----| nuxt.config.ts
-----| app/
-------| pages/
---------| admin.vue
-------| layouts/
---------| admin.vue

Автоматические алиасы

Для srcDir каждого слоя создаётся алиас #layers/[имя]:

import something from '#layers/base/path/to/file'
import { useAdmin } from '#layers/admin/composables/useAdmin'
Именованные алиасы слоёв появились в Nuxt v3.16.0.

Содержимое слоя

Каждый слой может включать:

  • nuxt.config.ts — конфигурацию слоя, которая сливается с основной
  • app.config.ts — реактивный app.config
  • components/ — компоненты Vue (автоимпорт)
  • composables/ — композаблы (автоимпорт)
  • utils/ — утилиты (автоимпорт)
  • pages/ — страницы приложения
  • layouts/ — лейауты
  • middleware/ — middleware маршрутов
  • plugins/ — плагины Nuxt
  • server/ — серверные маршруты, middleware и утилиты
  • shared/ — общий код между приложением и сервером

Порядок приоритета

Если несколько слоёв задают один ресурс (компонент, композабл, страницу и т.д.), выигрывает слой с большим приоритетом. По умолчанию порядок алфавитный: позже в алфавите — выше приоритет (Z > A).

Явный порядок — префиксы в имени папки: 1.base/, 2.features/, 3.admin/.

Узнать больше Docs > 3 X > Getting Started > Layers#layer Priority.