Wot UnoCSS Preset 使用指南 适用场景 当用户询问以下内容时,优先使用本 Skill: - 如何安装 - 如何在 配置 - 、 、 怎么用 - 为什么类名不生效、自动补全不出现、CI 与本地结果不一致 目标是给出可直接复制的最佳实践,帮助用户快速完成接入并稳定运行。 最小安装步骤 推荐配置(完整示例) 配置项说明 - :工具类前缀,默认 。示例: 、 。 - :是否注入 wot-ui CSS 变量,默认 。 - :是否开放基础色板和原始 token 类名,默认 。 常用类名示例 - 颜色: 、 、 - 间距: 、 、 - 内边距: 、 、 - 圆角: 、 - 字重: 、 - 排版: 、 - 透明度: - 描边: 上手示例(可复制) 1) 一个“卡片”示例(uni-app / Vue) 2) 间距/布局示例(常见组合) - 外边距: 、 、 - 内边距: 、 、 - 横向/纵向组合: 、 - gap: 、 、 3) 语义色示例(背景/文字/边框) - 背景: 、 、 、 - 文字: 、 、 、 - 边框: 、 、 、 4) 暗黑模式示例 预设会输出暗色变量选择器 ,你只需要在根节点加 class: 5) 打开 baseTokens(可选) 当你希望使用基础色板/原始 token 时启用: 启用后会额外提供类似 这类 token(用于 与颜色规则匹配)。 轻量提醒 -…