Vue JS mangrupikeun kerangka JavaScript progresif anu dianggo pikeun ngembangkeun aplikasi halaman tunggal (SPA) sareng Antarmuka Pamaké. Sareng éta salah sahiji kerangka hareup-tungtung anu paling seueur dianggo di luar dinya.
Salah sahiji fitur anu pikaresepeun tina Vue nyaéta kamampuan pikeun ngarobih halaman wéb kana komponén anu béda. Sareng prosés ieu janten langkung saderhana kalayan ngagunakeun perpustakaan komponén UI.
Aya rupa-rupa perpustakaan komponén UI nu bisa mantuan Anjeun nyieun komponén gampang jeung gancang. Janten dina blog ieu, urang badé marios 10 Perpustakaan Komponen Vue UI anu paling luhur pikeun 2021.
1. PrimeVue
PrimeVue mangrupakeun basajan ngagunakeun, serbaguna, sarta performant Perpustakaan komponén Vue UI nu mantuan Anjeun ngawangun interfaces pamaké Heboh.
Éta ngagaduhan langkung ti 80+ komponén UI kalayan dukungan lengkep pikeun Pedoman Aksesibilitas Kandungan Wéb (WCAG) sareng desain responsif. Sareng hatur nuhun kana pembaruan énggal, perpustakaan ayeuna gaduh dukungan pinuh pikeun Vue 3. Éta ogé ngagaduhan langkung seueur komponén.
Salah sahiji hal anu pangsaéna ngeunaan Primevue nyaéta rupa-rupa komponén. Éta rupa-rupa ti tabel sarta paginator ka grafik organisasi dumasar-grafik well-crafted nu bisa Anjeun pake pikeun nyieun aktip Vue interaktif. Éta open-source sareng gaduh 1k+ béntang dina Github sareng 6,983 unduhan mingguan dina NPM.
2. Vuetify
Vuetify mangrupikeun Perpustakaan UI Vue kalayan Komponén buatan tangan anu saé anu ngagunakeun spésifikasi Desain Bahan. Ieu ngandung harti yén éta geus dimekarkeun persis nurutkeun spésifikasi Desain Bahan kalawan unggal komponén meticulously crafted janten modular, responsif, sarta performant.
Vuetify ngamungkinkeun anjeun ngaropea aplikasi anjeun sareng perenah unik sareng dinamis sareng nyampurnakeun gaya komponén anjeun nganggo variabel SASS.
Éta ogé ngadukung pedoman aksés, sadaya panyungsi modéren, sareng cocog sareng Vue CLI-3. Gampang ngahijikeun sareng gaduh seueur komponén UI anu tiasa dianggo deui sapertos carousel, navigasi, sareng kartu. Vuetify mangrupikeun sumber terbuka sareng langkung ti 29k béntang dina Github sareng 319,170 undeuran mingguan dina NPM.
3. Cakra UI Vue
Chakra UI mangrupikeun perpustakaan komponén modular sareng gampang diaksés anu masihan anjeun alat pikeun ngawangun aplikasi Vue gancang sareng gampang.
Sadaya komponén tiasa diaksés (saleresna nuturkeun standar WAI-ARIA), tiasa ditéma, sareng tiasa dianggo. Éta ngadukung gaya responsif di luar kotak sareng cocog sareng mode poék.
Chakra UI ogé ngandung sakumpulan komponén perenah sapertos CBox sareng CStack anu ngagampangkeun gaya komponén anjeun ku ngaliwat prop. Éta ogé ngamungkinkeun anjeun ngimpor otomatis komponén Chakra UI Vue nganggo solusi plugin webpack. Éta open-source sareng gaduh 900+ béntang dina Github sareng unduhan 331 mingguan dina NPM.
4. Bootstrap Vue
BootstrapVue, Kalayan BootstrapVue anjeun tiasa ngawangun proyék responsif, mobile-first, sareng ARIA diaksés dina wéb nganggo Vue.js sareng perpustakaan CSS front-end populér - Bootstrap. Dokuméntasina gampang kahartos sareng éta ogé gampang diatur. Éta ngajadikeun palaksanaan hareup-tungtung dilakukeun langkung gancang.
Éta nawiskeun langkung ti 85 komponén, langkung ti 45 plugins anu sayogi, sababaraha arahan, sareng 1000+ ikon. Ogé nyadiakeun komponén fungsi tailored pikeun perenah jeung desain responsif. anjeun ogé tiasa sacara gampil ngahijikeun BootstrapVue kana proyék Nuxt.js anjeun nganggo modul Nuxt.js.
Éta ogé dianggo dina cara anu sami sareng kerangka bootstrap CSS anu dianggo. Ieu open-sourced on Github kalawan ngeunaan 12.9k béntang sarta 1.7k garpu.
5. Vuesax
Vuesax mangrupikeun kerangka komponén UI énggal anu diciptakeun sareng Vuejs pikeun ngadamel proyék kalayan gampang sareng gaya anu unik sareng pikaresepeun, vuesax didamel ti mimiti sareng dirarancang pikeun sagala jinis pamekar ti pencinta frontend dugi ka tukang anu hoyong gampang nyiptakeun pendekatan visualna. pamaké tungtung. Desain anu unik pikeun tiap komponén tur teu anchored kana sagala tren visual atawa aturan desain, sahingga proyék diwangun kalayan eta unik ogé.
éta nawiskeun halaman responsif sareng komponén UI anu tiasa dianggo deui sareng disaluyukeun. Éta ogé gampang pikeun ngamimitian nganggo npm atanapi CDN. Ayeuna teu ngarojong Vue CLI 3 dina versi panganyarna na. Ieu open-sourced on Github kalawan ngeunaan 4.9k béntang sarta 6700 undeuran mingguan NPM.
6. Sireum Desain Vue
Desain sireum vue dumasar kana spésifikasi Desain Sireum, Desain vue sireum vue perpustakaan vue UI nu ngandung susunan komponén kualitas luhur jeung demo pikeun ngawangun euyeub, panganteur pamaké interaktif.
Ant-design-vue nyayogikeun seueur komponén UI pikeun ngabeungharan aplikasi wéb anjeun sapertos Skeleton, laci, statistik sareng seueur deui.
Jeung release panganyarna tina sireum design vue Vérsi 2, eta geus diropéa pikeun jadi leuwih gancang sarta gampang pikeun ngahijikeun, ukuran kebat leutik, sarta ogé ngarojong Vue 3, Dokumén API Komposisi Anyar. Éta ogé ngadukung browser wéb modern, Rendering sisi server, sareng éléktron. Éta ngagaduhan langkung ti 13k béntang dina Github sareng 39,693 undeuran mingguan NPM.
7. Kuasar
Quasar mangrupikeun salah sahiji kerangka UI Vue anu pangsaéna anu ngamungkinkeun para pamekar ngagunakeun hiji basis kode sumber pikeun sadaya platform ngalangkungan Quasar CLI kalayan prakték pangsaéna tina kotak. Éta ngamungkinkeun para pamekar museurkeun kana eusi Aplikasina tinimbang sadaya barang pelapis boiler anu sanés (ngawangun sistem, perenah) di sakurilingna. eta fokus kana nuturkeun tungtunan Bahan 2.0 sarta ogé ngabogaan komunitas pisan supportive.
Salah sahiji hal husus ngeunaan Quasar nyaéta kamampuhan pikeun nulis kode sakali sarta sakaligus nyebarkeun eta salaku ramatloka, a Mobile App ngagunakeun ngan hiji codebase. Aya ogé vérsi énggal ayeuna dina béta anu bakal ngadukung fitur vue 3. Mibanda ngeunaan 17.8k béntang on Github.
8. Buefy
Buefy mangrupikeun perpustakaan komponén UI anu ringan pikeun Vue JS dumasar kana Bulma (kerangka CSS). Buefy ngagabungkeun Bulma sareng Vue, ngabantosan anjeun ngawangun aplikasi anu saé nganggo kode minimal. éta lapisan JavaScript pikeun panganteur Bulma Anjeun.
Éta tiasa diimpor lengkep atanapi komponén tunggal dina halaman wéb biasa. Ngahijikeun kana proyék anjeun cukup gampang, tiasa dilakukeun nganggo npm atanapi CDN.
Buefy nyadiakeun komponén UI siap-dijieun, perenah, sarta ikon. Komponén tiasa nganggo SASS pikeun téma anjeun. Ogé ngarojong browser modern.
9. Bahan Vue
Bahan Vue mangrupikeun kerangka anu lega sareng ringan anu ngalaksanakeun spésifikasi Desain Bahan. Éta mangrupikeun salah sahiji integrasi anu pangsaéna antara Vue.js sareng spésifikasi Desain Bahan! Anjeun tiasa sacara gampil ngonpigurasikeunana pikeun nyocogkeun sadayana kabutuhan anjeun ngalangkungan API anu gampang.
Éta cocog sareng desain responsif sareng dukungan pikeun sadaya browser wéb modern. Perpustakaan dibagi kana Téma, Komponén, sareng Unsur UI. Téma éta masihan pituduh anu pasti ngeunaan cara téma aplikasi anjeun (atanapi nyerat téma anjeun nyalira) sareng Komponén sareng Elemen UI diwangun ku perenah, navigasi, tipografi, ikon, sareng 30 komponén deui. Éta ngagaduhan kira-kira 9.2k béntang sareng 1.1k garpu dina Github sareng 21k + undeuran mingguan NPM.
10. KeenUI
KeenUI mangrupikeun perpustakaan UI vue.js anu ringan sareng API anu sederhana, diideuan ku Desain Bahan Google. Keen UI sanes kerangka CSS. Ku alatan éta, teu kaasup gaya pikeun sistem grid, tipografi, jsb Gantina, fokus dina komponén interaktif nu merlukeun Javascript.
Cai mibanda ngeunaan 30 komponén reusable. Komponénna tiasa disaluyukeun ku cara nimpa gaya nganggo variabel SASS. anjeun tiasa ngahijikeun kana proyék anjeun nganggo CDN atanapi npm. Éta sumber terbuka sareng gaduh kira-kira 4k béntang dina Github.
kacindekan
Perpustakaan komponén UI pasti ngajantenkeun ngawangun proyék langkung gampang. Milih anu leres gumantung kana fitur proyék anu anjeun hoyong damel. Sateuacan diving kana proyék anyar, éta sasaena pikeun hiji marios perpustakaan komponén UI nu paling cocog pikeun kaperluan éta.