Слои

Одной из основных особенностей Nuxt являются слои и поддержка расширений. Вы можете расширить стандартное приложение Nuxt для повторного использования компонентов, утилит и конфигурации. Структура слоев практически идентична стандартному приложению Nuxt, что делает их простыми в создании и поддержке.

Случаи использования

• Переиспользование предустановок конфигурации в проектах с помощью nuxt.config и app.config
• Создание библиотеки компонентов, с использованием директории components/
• Создание библиотек утилит и композаблов с использованием директорий composables/ и utils/
• Создание предустановок модуля Nuxt
• Распространение стандартных настроек по всем проектам
• Создание тем Nuxt
• Улучшение организации кода за счет внедрения модульной архитектуры и поддержки шаблона Domain-Driven Design (DDD) в больших масштабируемых проектах.

Использование

By default, any layers within your project in the ~~/layers directory will be automatically registered as layers in your project.

In addition, named layer aliases to the srcDir of each of these layers will automatically be created. For example, you will be able to access the ~~/layers/test layer via #layers/test.

Кроме того, вы можете расширить слой, добавив свойство extends в файл nuxt.config.

export default defineNuxtConfig({
  extends: [
    '../base',                     // Расширение из локального слоя
    '@my-themes/awesome',          // Расширение из установленного пакета npm
    'github:my-themes/awesome#v1', // Расширение из git репозитория
  ]
})

Вы также можете передать токен аутентификации, если вы расширяете из приватного GitHub репозитория:

export default defineNuxtConfig({
  extends: [
    // конфигурация каждого слоя
    ['github:my-themes/private-awesome', { auth: process.env.GITHUB_TOKEN }]
  ]
})

export default defineNuxtConfig({
  extends: [
    [
      'github:my-themes/awesome',
      { 
        meta: {
          name: 'my-awesome-theme',
        },
      },
    ],
  ]
})

Nuxt использует unjs/c12 и unjs/giget для расширения удаленных слоев. Обратитесь к документации для получения дополнительной информации и всех доступных опций.

Примеры