UnoCSS 实践笔记:原子化 CSS 的正确姿势

2026-07-05 前端开发 有希 116 views

demo data

UnoCSS 不是又一个 Tailwind 克隆,它的核心是按需生成。

安装与配置

import UnoCSS from "unocss/vite"

export default {
  plugins: [UnoCSS()]
}

常用预设

  • presetWind3:Tailwind 兼容语法
  • presetIcons:图标按需生成
  • presetTypography:prose 排版,适合文章正文

少写 CSS,多写类名,产出更小的样式文件。

Comments

Sign in to join the discussion

No comments yet — be the first to say something

Related Articles

aiitoo.com © 2026. All Rights Reserved.