Плагин для Rollup и Rolldown

Используйте UnoCSS с Rollup или Rolldown без Vite. Плагин поддерживает режим global и создаёт CSS-ресурс при импорте uno.css из входного модуля.

Установка

pnpm

pnpm add -D unocss rollup

yarn

yarn add -D unocss rollup

npm

npm install -D unocss rollup

bun

bun add -D unocss rollup

Замените rollup на rolldown при использовании Rolldown.

Rollup

rollup.config.ts

import UnoCSS from 'unocss/rollup'

export default {
  input: 'src/main.ts',
  plugins: [
    UnoCSS(),
  ],
}

Rolldown

rolldown.config.ts

import UnoCSS from 'unocss/rolldown'

export default {
  input: 'src/main.ts',
  plugins: [
    UnoCSS(),
  ],
}

Импортируйте uno.css из входного модуля:

src/main.ts

import 'uno.css'

Плагин создаёт сгенерированный CSS как выходной ресурс. Подключите этот ресурс в своём приложении с помощью пайплайна развёртывания или HTML.

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

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

uno.config.ts

import { defineConfig } from 'unocss'

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

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

import UnoCSS from 'unocss/rollup'

UnoCSS({
  // ...параметры UnoCSS
})