Nuxt Module

UnoCSS용 Nuxt 모듈입니다.

설치

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

Nuxt 설정 파일에 @unocss/nuxt를 추가하세요:

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

uno.config.ts 파일을 생성하세요:

import { defineConfig } from 'unocss'

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

uno.css 엔트리는 모듈에 의해 자동으로 주입됩니다.

지원 상태

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

설정

구성을 위해 전용 uno.config.ts 파일 사용을 권장합니다. 자세한 내용은 Config File을 참조하세요.

nuxtLayers 옵션을 활성화하면 Nuxt가 각 Nuxt 레이어의 uno.config 파일을 자동으로 병합합니다:

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

그러면 루트 설정 파일에서 생성된 설정을 다시 내보낼 수 있습니다:

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

export default config

또는 수정/확장할 수 있습니다:

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

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

라이선스

• MIT License © 2021-PRESENT Anthony Fu