Module Nuxt

Le module Nuxt pour UnoCSS.

Installation

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

Ajoutez @unocss/nuxt à votre fichier de configuration Nuxt :

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

Créez un fichier uno.config.ts :

import { defineConfig } from 'unocss'

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

L'entrée uno.css sera automatiquement injectée par le module.

État du support

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

Configuration

Nous recommandons d'utiliser le fichier dédié uno.config.ts pour la configuration. Voir Fichier de configuration pour plus de détails.

Vous pouvez activer l'option nuxtLayers, ainsi Nuxt fusionnera automatiquement les fichiers uno.config de chaque couche Nuxt :

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

puis vous pouvez réexporter la configuration générée dans le fichier de configuration racine :

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

export default config

ou la modifier/l'étendre :

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

export default mergeConfigs([config, {
  // vos surcharges
}])

Licence

• Licence MIT © 2021-PRÉSENT Anthony Fu