OpenTiny Logo

一套跨端、跨框架的企业级 UI 组件库,支持 Vue 2 和 Vue 3,支持 PC 端和移动端。

[English](README.md) | 简体中文 🌈 特性: - 📦 包含 104 个简洁、易用、功能强大的组件 - 🖖 一套代码同时支持 Vue 2 和 Vue 3 - 🖥️ 一套代码同时支持 PC 端和移动端 - 🌍 支持国际化 - 🎨 支持主题定制 - 📊 组件内部支持配置式开发,可支持低代码平台可视化组件配置 - 💡 采用模板、样式、逻辑分离的跨端、跨框架架构,保障灵活性和可移植性 ## 🛠️ 如何使用 ### 1. 安装 执行以下命令,安装 Vue 3 版本的 TinyVue 组件库: ```shell npm i @opentiny/vue@3 ``` 执行以下命令,安装 Vue 2 版本的 TinyVue 组件库: ```shell npm i @opentiny/vue@2 ``` ### 2. 引入和使用 在`App.vue`文件中使用 TinyVue 组件。 ```html ``` ## 🖥️ 本地开发 ```shell git clone git@github.com:opentiny/tiny-vue.git cd tiny-vue pnpm i # 启动 Vue3 项目 pnpm dev # 启动 Vue2 项目 pnpm dev2 ``` 打开浏览器访问:[http://127.0.0.1:7130/](http://127.0.0.1:7130/) ## 🤝 参与贡献 如果你对我们的开源项目感兴趣,欢迎加入我们!🎉 参与贡献之前请先阅读[贡献指南](CONTRIBUTING.zh-CN.md)。 - 添加官方小助手微信 opentiny-official,加入技术交流群 - 加入邮件列表 opentiny@googlegroups.com ## ✨ 贡献者 贡献者是在 OpenTiny 社区中合并了 1 个或多个 PR 的社区成员。 感谢以下 OpenTiny 的贡献者们 ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
Kagol
Kagol

💻
ajaxzheng
ajaxzheng

💻
TC-twwang
TC-twwang

💻
jacknan
jacknan

💻
Pithy
Pithy

💻
heygsc
heygsc

💻
MangoWu
MangoWu

💻
ADNY
ADNY

💻
chenxi-20
chenxi-20

💻
Alaray
Alaray

💻
ing
ing

💻
申君健
申君健

💻
MomoPoppy
MomoPoppy

💻
WXC-Spring
WXC-Spring

💻
GaoNeng
GaoNeng

💻
acyza
acyza

💻
ygj6
ygj6

💻
MrWang2016
MrWang2016

💻
qinwencheng
qinwencheng

💻
黄怡林
黄怡林

💻
zuixinwang
zuixinwang

💻
luopei
luopei

💻
前端爆冲
前端爆冲

🚇
Xie Jay
Xie Jay

🚇
linxiang
linxiang

💻
程序员包子
程序员包子

💻
peter G
peter G

💻 📖
gimmyhehe
gimmyhehe

💻
dong
dong

💻
凌览
凌览

💻
Caesar-ch
Caesar-ch

💻
chenqifeng66
chenqifeng66

⚠️
Zz-ZzzZ
Zz-ZzzZ

⚠️
Lyx
Lyx

💻
Spark Bill
Spark Bill

💻
wendZzoo
wendZzoo

💻
Gweesin Chan
Gweesin Chan

💻
Binks_
Binks_

📖
yoyo
yoyo

💻
Kif
Kif

💻
jack-zishan
jack-zishan

💻
LinboLen
LinboLen

💻
vaebe
vaebe

💻
YuYan Li
YuYan Li

💻
shonen7
shonen7

💻
xlearns
xlearns

💻
tianxin
tianxin

💻
Xppp0217
Xppp0217

💻
AcWrong02
AcWrong02

🐛
betavs
betavs

💻
fanbingbing16
fanbingbing16

💻
dyh333
dyh333

📖
betterdancing
betterdancing

📖
David
David

💻
falcon-jin
falcon-jin

💻
wuyiping0628
wuyiping0628

⚠️
James
James

📖
## ❤️ Credits 感谢: - [element](https://github.com/ElemeFE/element) 项目,它是一个老牌的基于 Vue.js 的组件库,TinyVue 在设计之初借鉴了 Element,并针对 Element 的组件 API 进行兼容。 - [floating-ui](https://github.com/floating-ui/floating-ui) 项目,它是一个轻量级、无依赖、高性能的定位库,TinyVue 的多个组件都是基于 Floating UI 提供的能力。 - [vxe-table](https://github.com/x-extends/vxe-table) 项目,它是一个基于 Vue 的表格组件,支持丰富的功能,TinyVue 的 Grid 组件基于 vxe-table。 - [sortablejs](https://github.com/SortableJS/Sortable) 项目,它是一个功能强大的拖拽库,TinyVue 的 Grid / Transfer / Tabs 等多个组件的拖拽排序功能都基于 Sortable。 - [@adamwathan](https://github.com/adamwathan) 写的文章[《Renderless Components in Vue.js》](https://adamwathan.me/renderless-components-in-vuejs/),这篇文章启发了 TinyVue 的无渲染组件设计架构,并最终在 TinyVue 项目中实现了跨端、跨框架能力。 ## 开源协议 [MIT](LICENSE)