UnoCSS Next.js Integratie

// TODO: link to voorbeelden

Aan de slag met UnoCSS en Next.js.

Setup

Installatie

pnpm

pnpm add -D unocss @unocss/webpack

yarn

yarn add -D unocss @unocss/webpack

npm

npm install -D unocss @unocss/webpack

bun

bun add -D unocss @unocss/webpack

Configuratie

Maak uno.config.ts aan in de root van je project.

import {
  defineConfig,
  presetAttributify,
  presetIcons,
  presetWebFonts,
  presetWind3
} from 'unocss'

export default defineConfig({
  presets: [
    presetWind3(),
    // ...
  ],
})

Plugin toevoegen

Voeg dan UnoCSS toe als plugin aan webpack via je next.config.js.