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

Подключение плагинов Vite в проект Nuxt.

Модули Nuxt покрывают много сценариев, но иногда достаточно одного плагина Vite.

Установите нужный плагин (в примере — @rollup/plugin-yaml), затем добавьте его в nuxt.config.ts:

nuxt.config.ts
import yaml from '@rollup/plugin-yaml'

export default defineNuxtConfig({
  vite: {
    plugins: [
      yaml(),
    ],
  },
})

После этого можно импортировать YAML-файлы в компонентах (например config.yaml с данными конфигурации).

Плагины Vite в модулях Nuxt

В модуле подключайте плагины через утилиту addVitePlugin:

modules/my-module.ts
import { addVitePlugin, defineNuxtModule } from '@nuxt/kit'
import yaml from '@rollup/plugin-yaml'

export default defineNuxtModule({
  setup () {
    addVitePlugin(yaml())
  },
})

В Nuxt 5+ для плагинов, зависящих от окружения, используйте метод applyToEnvironment().

Для доступа к итоговой конфигурации Vite используйте хуки config и configResolvedвнутри плагина Vite, а не Nuxt-хуки vite:extend, vite:extendConfig, vite:configResolved.
Узнать больше Docs > 4 X > API > Kit > Builder#addviteplugin.