Skip to content

TinyVue is an enterprise-class UI component library of OpenTiny community, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

License

Notifications You must be signed in to change notification settings

trueLoving/tiny-vue

ย 
ย 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

OpenTiny Logo

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

English | ็ฎ€ไฝ“ไธญๆ–‡

๐ŸŒˆ Features:

  • ๐Ÿ“ฆ 104 clean, easy-to-use and powerful components.
  • ๐Ÿ–– One code, Support both Vue.js 2 and Vue.js 3.
  • ๐Ÿ–ฅ๏ธ One code, Support both PC and Mobile.
  • ๐ŸŒ Support internationalization.
  • ๐ŸŽจ Support theme customization.
  • ๐Ÿ“Š Components support configuration development, can support low-code platform.
  • ๐Ÿ’ก Use a cross-end and cross-framework architecture, flexible and portable.

๐Ÿ› ๏ธ Usage

1. Installation

Execute the following command to install the TinyVue component library for Vue.js 3.

npm i @opentiny/vue@3

Execute the following command to install the TinyVue component library for Vue.js 2.

npm i @opentiny/vue@2

2. Import component

Then you can use the TinyVue component(such as <tiny-button>) in the App.vue file.

<script lang="ts" setup>
  import { Button as TinyButton } from '@opentiny/vue'
</script>

<template>
  <tiny-button>Tiny Vue</tiny-button>
</template>

๐Ÿ–ฅ๏ธ Development

git clone [email protected]:opentiny/tiny-vue.git
cd tiny-vue
pnpm i

# Vue.js 3
pnpm dev

# Vue.js 2
pnpm dev2

Open your browser and visit: https://127.0.0.1:7130/

๐Ÿค Contributing

Welcome to join our OpenTiny community!๐ŸŽ‰

If you don't know how to start, please read our contributing guide.

  • Add the official assistant WeChat opentiny-official and join the technical exchange group.
  • Add to the mailing list [email protected]

โœจ Contributors

Contributors are community members who have 1 or more PR merged in OpenTiny.

Thanks goes to these wonderful people (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

๐Ÿ“–
ichynul
ichynul

๐Ÿ’ป
Davont
Davont

๐Ÿ’ป
Nick Wu
Nick Wu

๐Ÿ’ป
Floyd
Floyd

๐Ÿ’ป
Jevin
Jevin

๐Ÿ’ป
ๆ˜Ÿๆฒณ
ๆ˜Ÿๆฒณ

๐Ÿ’ป

โค๏ธ Credits

Thanks to:

  • The element project which is an old component library based on Vue.js. TinyVue draws on Element at the beginning of its design, and is compatible with Element's component API.
  • The floating-ui project which is a small library that helps you create "floating" elements such as tooltips, popovers, dropdowns, and more. Many components of TinyVue are based on the capabilities provided by Floating UI.
  • The vxe-table project which is a Vue-based table component, supports rich features, TinyVue's Grid component is based on vxe-table.
  • The sortablejs project which is a powerful drag-and-drop library. The drag-and-drop sorting function of TinyVue's Grid / Transfer / Tabs and other components is based on Sortable.
  • @adamwathan's article Renderless Components in Vue.js, which inspired TinyVue's renderless component design architecture and ultimately enabled cross-end and cross-framework capabilities in the TinyVue project.

License

MIT

About

TinyVue is an enterprise-class UI component library of OpenTiny community, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Less 51.7%
  • Vue 33.6%
  • JavaScript 8.4%
  • TypeScript 6.3%