Skip to content

Moduł Nuxt

Moduł Nuxt dla UnoCSS.

Instalacja

bash
pnpm add -D unocss @unocss/nuxt
bash
yarn add -D unocss @unocss/nuxt
bash
npm install -D unocss @unocss/nuxt
bash
bun add -D unocss @unocss/nuxt

Dodaj @unocss/nuxt do pliku konfiguracyjnego Nuxt:

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

Utwórz plik uno.config.ts:

ts
import { defineConfig } from 'unocss'

export default defineConfig({
  // ...Opcje UnoCSS
})

Wejście uno.css zostanie automatycznie wstrzyknięte przez moduł.

Status wsparcia

Nuxt 2Nuxt BridgeNuxt 3
Webpack Dev🚧
Webpack Build
Vite Dev-
Vite Build-

Konfiguracja

Zalecamy użycie dedykowanego pliku uno.config.ts do konfiguracji. Zobacz Plik konfiguracyjny, aby uzyskać więcej szczegółów.

Możesz włączyć opcję nuxtLayers, wtedy Nuxt automatycznie scali pliki uno.config z każdej warstwy Nuxt:

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

wtedy możesz ponownie wyeksportować wygenerowaną konfigurację w głównym pliku konfiguracyjnym:

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

export default config

or modify/extend it:

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

export default mergeConfigs([config, {
  // your overrides
}])

License

Released under the MIT License.