unocss-preset-ui-theme v0.1.1

unocss-preset-ui-theme

• 将常用组件库主题与 unocss 结合,轻松编码适配组件库的样式

介绍

unocss-preset-ui-theme 是基于 unocss 的一套主题，它将常用组件库的主题与 unocss 结合，通过一套简单易懂的配置，可以轻松地将组件库的样式适配到 unocss 中。

组件库支持

• Vue Arco ✅
• Vue Antd ⌛️
• Vue Element Plus ⌛️
• Vue Vant ⌛️
• Vue Naive UI ⌛️
• React Antd ⌛️
• React Arco ⌛️

安装

pnpm add unocss-preset-ui-theme -D

使用

// vite.config.ts
import { defineConfig } from 'vite'
import Unocss from 'unocss/vite'

export default defineConfig({
  plugins: [
    // ...other plugins
    Unocss()
  ]
})
// uno.config.ts
import { defineConfig } from 'unocss'
import presetUiTheme from 'unocss-preset-ui-theme'

export default defineConfig({
  presets: [
    presetUiTheme({ framework: 'vue', library: 'arco' })
    //...other presets
  ]
})

参数

• framework: 组件库的框架，目前支持 vue 和 react
• library: 组件库的名称，目前支持 arco antd element vant naive