Skip to content

Nuxt Module

Nuxt-modulen för UnoCSS.

Installation

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

Lägg till @unocss/nuxt i din Nuxt-konfigurationsfil:

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

Skapa en uno.config.ts-fil:

ts
import { defineConfig } from 'unocss'

export default defineConfig({
  // ...UnoCSS-alternativ
})

uno.css-posten kommer automatiskt att injiceras av modulen.

Supportstatus

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

Konfiguration

Vi rekommenderar att använda den dedikerade uno.config.ts-filen för konfiguration. Se Konfigurationsfil för mer information.

Du kan aktivera alternativet nuxtLayers, så kommer Nuxt automatiskt att slå samman uno.config-filer från varje Nuxt-lager:

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

sedan kan du återexportera den genererade konfigurationen i rotkonfigurationsfilen:

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

export default config

eller modifiera/utöka den:

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

export default mergeConfigs([config, {
  // dina åsidosättanden
}])

Licens

Released under the MIT License.