官网 （https://unocss.nodejs.cn/）

js
import {
  defineConfig,
  presetAttributify,
  presetIcons,
  presetTypography,
  presetUno,
  presetWebFonts,
  transformerDirectives,
  transformerVariantGroup,
} from "unocss";



export default defineConfig({
//预设
  shortcuts: {
    "flex-center": "flex items-center justify-center",
    "flex-between": "flex items-center justify-between",
    "flex-col-between": "flex flex-col items-center justify-between",
    "flex-col-center": "flex flex-col items-center justify-center",
  },
  //  变量映射 text-primary
  theme: {
    colors: {
      primary: "var(--el-color-primary)",
      primary_dark: "var(--el-color-primary-light-5)",
    },
  },
  presets: [
    presetUno(), // 基础原子类
    presetAttributify(), 属性写法
    presetIcons(), presetIcons()（图标）
    presetTypography(), //专门美化富文本 / Markdown
    presetWebFonts({  // 字体
      fonts: {}, 
    }),
  ],
  transformers: [transformerDirectives()
  .btn {
  @apply px-4 py-2 bg-primary text-white;
}
  
  , transformerVariantGroup()
  <div class="hover:(bg-red-500 text-white) md:(flex gap-4)">

  ],
});