更新记录
1.30.3(2026-05-24) 下载此版本
- Code Refactoring: 优化代理组件代码 (1e2c4ce)
- Bug Fixes: 新增back-press属性,允许自定义用户的返回操作 (5bf1425)
- Features: 新增scope属性和getAuthorize事件支持 (a863c8f)
- Features: 新增小程序关注生活号和授权相关事件支持 (5f2329a)
- Features: 新增弹窗、动作面板、分享面板等组件的插槽与命令式调用能力,优化Toast组件 (68e87fb)
1.30.2(2026-05-14) 下载此版本
- Bug Fixes: 修复表单项布尔类型属性的覆盖问题 (903a2c4)
1.30.1(2026-05-10) 下载此版本
- Bug Fixes: 修复小程序端字数限制问题 (a0c6923)
- Bug Fixes: 修复弹窗中使用时滚动位置不正确问题 (30fb9d9)
- Bug Fixes: 透传常用属性 (cc21393)
平台兼容性
uni-app(4.11)
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
|---|---|---|---|---|---|---|---|---|
| × | √ | 85 | 14.1 | √ | × | × | × | × |
| 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 小红书小程序 | 快应用-华为 | 快应用-联盟 |
|---|---|---|---|---|---|---|---|---|---|---|---|
| 2.3.0 | 2.9.1 | - | - | - | - | - | - | - | - | - | - |
其他
| 多语言 | 暗黑模式 | 宽屏模式 |
|---|---|---|
| √ | √ | √ |
Sard Uniapp
sard-uniapp 是一套基于 Uniapp + Vue3 框架开发的兼容多端的 UI 组件库。
介绍
sard-uniapp 是一套基于 Uniapp + Vue3框架开发的兼容多端的 UI 组件库。
sard-uniapp 兼容 H5 / 小程序(微信、支付宝) / APP(不支持 nvue 或 uvue)。
特性
- 🧩 117+个高质量组件,覆盖移动端主流场景
- 💪 支持一套代码同时开发 H5 / 小程序 / App
- 🌿 支持按需引入和
Tree Shaking - 📖 详尽的文档和案例展示
- ʦ 使用
TypeScript编写,提供完整的类型定义 - 🌈 支持定制主题
- 🌍 国际化支持
- 🌙 支持暗黑模式
- 🧪 单元测试覆盖率超过 80%,保障稳定性
- ⭐️ 零外部依赖,不依赖三方 npm 包
开源协议
本项目基于 MIT 协议,请自由地享受和参与开源。
更新日志
如何维护
前提条件
- 确保 node >= v22.22.2
- 建议使用 pnpm 包管理器
- 建议使用 vscode 编辑器
克隆仓库到本地
git clone https://github.com/sutras/sard-uniapp.git
安装依赖
npm install
修改 uniapp 构建脚本源码
打开 node_modules/@dcloudio/vite-plugin-uni/dist/cli/action.js 文件,
在 await (0, build_1.build)(options, async (event) => { 代码上面插入以下代码:
options.watch = {
chokidar: {
ignored: ['!**/sard-uniapp/**'],
},
}
运行开发环境
npm run dev
运行上面命令后会生成四个链接:
Local: http://localhost:5173/mobile/ (演示)
Network: http://192.168.1.121:5173/mobile/ (局域网演示)
Local: http://localhost:7761/ (文档)
Network: http://192.168.1.121:7761/ (局域网文档)
测试
npm run test
构建文档站点
npm run build:site
预览构建的文档站点
npm run preview
构建组件库
npm run build
部署文档站点到 github pages
npm run deploy
发布组件库到 npm
npm run release
修复问题流程
- 修复问题
- 测试
npm run test - 修改版本号
packages/sard-uniapp/package.json - 暂存
git add . - 提交
git commit -m 'fix: ' - 给提交打标签
npm run tag - 生成 changelog
npm run changelog - 暂存、提交 changelog
git commit -a -m 'chore: changelog' - 打包组件库
npm run build - 发布到 npm
npm run release - 使用 HBuilderX 发布到 uniapp 插件市场
- 推送代码和标签
npm run push - 打包文档
npm run build:site - 部署文档
npm run deploy
新增组件流程
- 运行
npm run nc命令创建组件 - 运行
npm run nsc命令创建子组件 - 编写组件代码(接口、类型、结构、样式、交互)
- 编写案例代码
- 编写组件文档
- 编写测试用例
- 分别在以下环境进行测试:
- 桌面端浏览器
- 移动端浏览器
- 微信开发者工具
- 微信真机
- 支付宝开发者工具
- 支付宝真机
- 安卓真机
- iOS模拟器
- 鸿蒙模拟器
- 从上面的“修复问题流程”步骤2开始走一遍
打包安卓包流程
- 在
HBuilder中打开sard-uniapp项目 - 点击 发行->App-Android/iOS-云打包
- 勾选“android(apk 包)” 、“使用云端证书”、“打正式包”、“快速安心打包”
- 点击“打包“按钮开始打包
- 注意:如果控制台出现错误:
[ERROR] Cannot start service: Host version "_._._" does not match - binary version "_._._",需安装和 Host version 一样版本的@esbuild/darwin-x64 - 等待云端打包完成
- 到
gitee仓库创建发行版:resource 发行版 - Gitee.com - 将 gitee 发行版 apk 资源链接转换为二维码图片
- 将图片更新到
sard-assets项目,并发布到 npm - 最后等待 http://fastly.jsdelivr.net 链接生效
贡献者
感谢这些优秀的人:

收藏人数:
https://github.com/sutras/sard-uniapp
https://www.npmjs.com/package/sard-uniapp
下载插件并导入HBuilderX
赞赏(3)
下载 1959
赞赏 3
下载 12352173
赞赏 1926
赞赏
京公网安备:11010802035340号