一套跨端、跨框架的企业级 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
TinyVue
```
## 🖥️ 本地开发
```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)):
## ❤️ 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)