核心优势
轻量高效
全纯 UTS 翻译库，轻如鸿毛快如闪电，告别层层封装的性能瓶颈。
完美适配
首个适配官方蒸汽模式 + external-class + CSS 元子化的最佳实践。
编译增强
独创 tui-vitex 编译器，VaporCSS 元子化处理，将 tuiplus 组件直接转换为官方组件，解决层层套娃的性能问题。
高性能图表
Canvas 直接绘制，告别 Webview 套壳，性能大幅提升。
技术亮点
VaporCSS 元子化样式
自研元子化样式系统，完美适配 UniApp X，编译期生成，运行时零开销。
tui-vitex 编译器
VaporCSS 元子化处理，将 tuiplus 组件直接转换为官方组件，解决层层套娃的性能问题。
tui-entine 渲染引擎
自研 Canvas Flex 布局渲染引擎，高性能绘制复杂组件，支持局部更新。
XCharts 图表库
纯 UTS 编写，Canvas 直接绘制，支持单 Canvas 多图表，性能卓越。
社区生态
关于
Tui Plus Vapor 是一套为 UniApp X 量身定制的现代化 UI 组件库，致力于解决传统 UI 组件库在 UniApp X 中的性能瓶颈和适配问题。
我们通过自研的编译器和渲染引擎，实现了轻量高效的组件渲染，同时提供了完整的主题系统和国际化支持，为开发者带来更好的开发体验。
核心团队拥有多年移动开发经验，专注于 UniApp X 生态建设，致力于打造性能最佳、体验最好的 UI 组件库。
入门指南
前置条件
系统要求
- Node.js 18.0+
- UniApp X 5.0+项目
环境配置与安装
安装步骤
- 在 HBuilder X 中通过插件市场导入
tui-plus-vapor插件 - 在项目根目录创建
vite.config.ts，配置tui-vitex插件（其他依赖会自动处理）
import { defineConfig } from 'vite';
import uni from '@dcloudio/vite-plugin-uni';
import TuiCollector from './uni_modules/tui-vitex';
export default defineConfig({
plugins: [
TuiCollector(),
uni()
]
});常见问题
Q: 如何解决样式冲突？
A: VaporCSS 采用命名空间隔离，所有样式类都以 t- 前缀开头，避免与其他样式冲突。
Q: 如何自定义主题？
A: 在 theme.json 中配置 light 和 dark 两套主题变量，支持完整的设计令牌体系。
Q: 支持哪些平台？
A: 支持所有 UniApp X 支持的平台，包括 iOS、Android、Web、HarmonyOS 等。
未来规划
插件规划
表单验证 · 状态管理 · 网络请求 · 本地存储
组件规划
更多图表 · 地图组件 · 3D 效果 · 增强表单
国际化
更多语言 · 动态切换 · 日期时间 · 货币
CSS 库
元子化样式 · 响应式 · 动画 · 暗黑模式
主题配置
Tui Plus Vapor 完美兼容了官方主题，对 theme.json 进行扩展 light 和 dark 默认两套主题变量，主题默认配置vite插件会自动添加到项目中，无需手动创建
{
"light": {
"primaryNormal": "#2979ff",
"textPrimary": "#303133",
"backgroundColor": "#ffffff"
},
"dark": {
"primaryNormal": "#0000ff",
"textPrimary": "#E5E5E5",
"backgroundColor": "#1F1F1F"
}
}详细配置说明请参考 主题配置 文档。
联系我
社区交流
加入社区讨论和分享
问题反馈
提交问题和建议帮助我们改进
给个 Star
喜欢这个项目就点个 Star 吧
更新日志
v5.0.0
2026-03-29- 发布 5.0 版本，解决 UI 组件库层层封装的性能问题
- 新增 tui-vitex 编译器，VaporCSS 元子化处理，将 tuiplus 组件直接转换为官方组件
- 新增 tui-entine 渲染引擎，高性能绘制复杂组件
- 新增 XCharts 图表库，Canvas 直接绘制
- 完善 VaporCSS 元子化样式系统
v4.0.0
2026-01-15- 支持 UniApp X 蒸汽模式
- 完善 external-class 支持
- 优化主题系统，支持明暗模式