Модуль Nuxt

Модуль Nuxt для UnoCSS.

Установка

pnpm

pnpm add -D unocss @unocss/nuxt

yarn

yarn add -D unocss @unocss/nuxt

npm

npm install -D unocss @unocss/nuxt

bun

bun add -D unocss @unocss/nuxt

Добавьте @unocss/nuxt в ваш конфигурационный файл Nuxt:

export default defineNuxtConfig({
  modules: [
    '@unocss/nuxt',
  ],
})

Создайте файл uno.config.ts:

import { defineConfig } from 'unocss'

export default defineConfig({
  // ...Параметры UnoCSS
})

Точка входа uno.css будет автоматически внедрена модулем.

Статус поддержки

	Nuxt 2	Nuxt Bridge	Nuxt 3
Webpack Dev	✅	✅	🚧
Webpack Build	✅	✅	✅
Vite Dev	-	✅	✅
Vite Build	-	✅	✅

Конфигурация

Мы рекомендуем использовать отдельный файл uno.config.ts для конфигурации. Смотрите Файл конфигурации для более подробной информации.

Вы можете включить опцию nuxtLayers, чтобы Nuxt автоматически объединял файлы uno.config из каждого слоя Nuxt:

export default defineNuxtConfig({
  // ...
  unocss: {
    nuxtLayers: true,
  },
})

Затем вы можете реэкспортировать сгенерированную конфигурацию в корневом файле конфигурации:

import config from './.nuxt/uno.config.mjs'

export default config

или изменить/расширить ее:

import { mergeConfigs } from '@unocss/core'
import config from './.nuxt/uno.config.mjs'

export default mergeConfigs([config, {
  // ваши переопределения
}])

Лицензия

• Лицензия MIT © 2021-НАСТОЯЩЕЕ ВРЕМЯ Anthony Fu