Nuxt Module

Module Nuxt cho UnoCSS.

Cài đặt

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

Thêm @unocss/nuxt vào tệp cấu hình Nuxt của bạn:

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

Tạo một tệp uno.config.ts:

import { defineConfig } from 'unocss'

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

Điểm nhập uno.css sẽ được module tự động chèn vào.

Trạng thái hỗ trợ

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

Cấu hình

Chúng tôi khuyên bạn nên dùng tệp uno.config.ts chuyên dụng để cấu hình. Xem Tệp Cấu hình để biết thêm chi tiết.

Bạn có thể bật tùy chọn nuxtLayers, vì vậy Nuxt sẽ tự động hợp nhất các tệp uno.config từ mỗi layer Nuxt:

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

sau đó bạn có thể reexport cấu hình được tạo trong tệp cấu hình gốc:

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

export default config

hoặc sửa đổi/mở rộng nó:

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

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

Giấy phép

• MIT License © 2021-PRESENT Anthony Fu