Vue JS یو پرمختللی جاواسکریپټ چوکاټ دی چې د واحد پاڼې غوښتنلیکونو (SPAs) او کارن انٹرفیسونو پراختیا لپاره کارول کیږي. او دا یو له خورا پراخه کارول شوي مخکښې پای چوکاټونو څخه دی چې هلته شتون لري.

 

د Vue یوه په زړه پورې ځانګړتیا د دې وړتیا ده چې ویب پاڼه په مختلفو برخو کې مات کړي. او دا پروسه د UI اجزاو کتابتونونو کارولو سره ساده کیږي.

 

دلته د UI اجزاو مختلف کتابتونونه شتون لري چې کولی شي تاسو سره په اسانۍ او ګړندي اجزاو رامینځته کولو کې مرسته وکړي. نو پدې بلاګ کې ، موږ د 10 لپاره د غوره 2021 Vue UI اجزاو کتابتونونو بیاکتنه کوو.

 

1. PrimeVue

 

PrimeVue د کارولو لپاره یو ساده، څو اړخیز، او د کاروونکي Vue UI اجزاو کتابتون دی چې تاسو سره د غوره کاروونکي انٹرفیسونو په جوړولو کې مرسته کوي.

 

دا د ویب مینځپانګې لاسرسي لارښودونو (WCAG) او ځواب ویونکي ډیزاین لپاره بشپړ ملاتړ سره له 80+ څخه ډیر UI اجزا لري. او د وروستي تازه کولو څخه مننه ، کتابتون اوس د Vue 3 لپاره بشپړ ملاتړ لري. دا یو شمیر نورې برخې هم ترلاسه کړې.

 

د Primevue په اړه یو له غوره شیانو څخه د دې د برخو پراخه لړۍ ده. دوی د جدولونو او مخونو څخه نیولې تر ګراف پورې اړوند تنظیمي چارټونو پورې اړه لري چې تاسو یې د متقابل Vue ایپس جوړولو لپاره کارولی شئ. دا خلاص سرچینه ده او په ګیتوب کې 1k+ ستوري لري او په NPM کې په اونۍ کې 6,983 ډاونلوډونه لري.

 

2. Vuetify

 

Vuetify د Vue UI کتابتون دی چې د ښکلي لاسي جوړ شوي اجزاو سره چې د موادو ډیزاین مشخصات کاروي. د دې معنی دا ده چې دا د موادو ډیزاین ځانګړتیاو سره سم په سمه توګه رامینځته شوی چې د هرې برخې سره په دقت سره جوړ شوی ترڅو ماډلر ، ځواب ویونکي او فعالیت وي.

 

Vuetify تاسو ته اجازه درکوي خپل غوښتنلیکونه د ځانګړي او متحرک ترتیبونو سره تنظیم کړئ او د SASS متغیرونو په کارولو سره ستاسو د برخو سټایلونه بشپړ کړئ.

 

دا د لاسرسي لارښودونو ملاتړ هم کوي ، ټول عصري براوزرونه ، او د Vue CLI-3 سره مطابقت لري. دا ادغام کول اسانه دي او د بیا کارونې وړ UI اجزا لري لکه کیروسل ، نیویګیشنونه او کارتونه. Vuetify خلاص سرچینه ده او په ګیتوب کې له 29k څخه زیاتو ستورو سره او په NPM کې په اونۍ کې 319,170 ډاونلوډونه لري.

 

3. چاکرا UI Vue

 

چاکرا UI یو ساده ماډلر او د لاسرسي وړ اجزاو کتابتون دی چې تاسو ته د Vue غوښتنلیکونو ګړندي او اسانه جوړولو لپاره وسیلې درکوي.

 

ټولې برخې د لاسرسي وړ دي (دا په کلکه د WAI-ARIA معیارونه تعقیبوي) ، د موضوع وړ او د ترکیب وړ. دا د بکس څخه بهر د ځواب ویونکي سټایلونو ملاتړ کوي او د تیاره حالت سره مطابقت لري.

 

چاکرا UI د ترتیب اجزاو سیټ هم لري لکه CBox او CSStack چې د پروپس په تیریدو سره ستاسو اجزاو سټایل کول اسانه کوي. دا تاسو ته اجازه درکوي د ویب پیک پلگ ان حل په کارولو سره د چاکرا UI Vue اجزا په اوتومات ډول وارد کړئ. دا خلاص سرچینه ده او په ګیتوب کې 900+ ستوري لري او په NPM کې 331 اونۍ ډاونلوډونه لري.

 

4. د بوټسټریپ Vue

 

BootstrapVue، د BootstrapVue سره تاسو کولی شئ د Vue.js په کارولو سره په ویب کې ځواب ورکوونکي، ګرځنده لومړی، او ARIA د لاسرسي وړ پروژې رامینځته کړئ او د مخکښې پای CSS کتابتون - بوټسټریپ. اسناد د پوهیدلو لپاره اسانه دي او تنظیم کول هم اسانه دي. دا د لومړي پای پلي کول ګړندي کوي.

 

دا 85+ اجزاوې وړاندې کوي، له 45 څخه ډیر موجود پلگ انونه، ډیری لارښوونې، او 1000+ شبیهونه. دا د ترتیب او ځواب ویونکي ډیزاین لپاره مناسب فعال اجزا هم چمتو کوي. تاسو کولی شئ په اسانۍ سره د Nuxt.js ماډل په کارولو سره BootstrapVue په خپلو Nuxt.js پروژو کې مدغم کړئ.

 

دا په ورته ډول کارول کیږي لکه څنګه چې د بوټسټراپ CSS چوکاټ کارول کیږي. دا د شاوخوا 12.9k ستورو او 1.7k فورکونو سره په ګیتوب کې خلاص سرچینه ده.

 

5. Vuesax

 

Vuesax یو نوی UI اجزاو چوکاټ دی چې د Vuejs سره رامینځته شوی ترڅو پروژې په اسانۍ او ځانګړي او خوندور سټایل سره رامینځته کړي ، vuesax له سکریچ څخه رامینځته شوی او د فرنټ انډ عاشق څخه تر شالید پورې د هر ډول پراختیا کونکو لپاره ډیزاین شوی څوک چې غواړي په اسانۍ سره خپل لید لید رامینځته کړي. وروستی کارونکی. ډیزاین د هرې برخې لپاره ځانګړي دي او د هیڅ لید رجحاناتو یا ډیزاین قواعدو سره لنگر ندي ، د دې سره جوړ شوي پروژې هم ځانګړي کوي.

 

دا ځواب ورکوونکي پاڼې او د بیا کارونې وړ او د تخصیص وړ UI اجزا وړاندې کوي. د npm یا CDN په کارولو سره پیل کول هم اسانه دي. دا اوس مهال په خپل وروستي نسخه کې د Vue CLI 3 ملاتړ نه کوي. دا په Github کې د شاوخوا 4.9k ستورو او 6700 اونۍ ډاونلوډونو NPM سره خلاص سرچینه ده.

 

6. د انټ ډیزاین Vue

 

د انټ ډیزاین ویو د انټ ډیزاین ځانګړتیاو پراساس ، د انټ ډیزاین ویو د ویو UI کتابتون دی چې د بډایه ، متقابل کارونکي انٹرفیسونو رامینځته کولو لپاره د لوړ کیفیت اجزاو او ډیمو سیټ لري.

 

Ant-design-vue ستاسو د ویب غوښتنلیکونو بډایه کولو لپاره ډیری UI برخې چمتو کوي لکه سکیلټون، دراز، احصایې او نور ډیر څه.

 

د اینټ ډیزاین vue نسخه 2 وروستي خپریدو سره ، دا د ګړندي او اسانه ادغام لپاره تازه شوی ، د کوچني بنډل اندازه ، او همدارنګه د Vue 3 ملاتړ کوي ، د نوي جوړښت API سند. دا د عصري ویب براوزرونو، د سرور اړخ رینډرینګ، او الکترون هم ملاتړ کوي. دا په ګیتوب کې له 13k څخه ډیر ستوري لري او په 39,693 اونیو کې NPM ډاونلوډ کوي.

 

7. قصر

 

Quasar یو له غوره Vue UI چوکاټونو څخه دی چې پراختیا کونکو ته اجازه ورکوي د Quasar CLI له لارې د ټولو پلیټ فارمونو لپاره د یوې سرچینې کوډ اساس وکاروي د بکس څخه بهر غوره تمرینونو سره. دا پراختیا کونکو ته اجازه ورکوي چې د دوی په شاوخوا کې د نورو ټولو بویلر پلیټینګ توکو (سیسټم جوړول ، ترتیب) پرځای د دوی اپلیکیشن مینځپانګې باندې تمرکز وکړي. دا د موادو 2.0 لارښوونو تعقیب باندې تمرکز کوي او خورا ملاتړ کونکی ټولنه هم لري.

 

د Quasar په اړه یو له ځانګړي شیانو څخه یو ځل د کوډ لیکلو وړتیا ده او په ورته وخت کې یې د ویب پا ،ې په توګه ځای په ځای کړئ ، د ګرځنده اپلیکیشن یوازې یو کوډبیس په کارولو سره. اوس مهال په بیټا کې یو نوی نسخه هم شتون لري چې د vue 3 ځانګړتیاو ملاتړ کوي. دا په ګیتوب کې شاوخوا 17.8k ستوري لري.

 

8. بوفی

 

Buefy د بلما (د CSS چوکاټ) پراساس د Vue JS لپاره د لږ وزن لرونکي UI اجزاو کتابتون دی. Buefy د Vue سره بلما ترکیب کوي ، تاسو سره د لږترلږه کوډ په کارولو سره د ښه لید غوښتنلیکونو رامینځته کولو کې مرسته کوي. دا ستاسو د بلما انٹرفیس لپاره د جاوا سکرپٹ پرت دی.

 

دا یا په عادي ویب پا onه کې په بشپړ ډول یا واحد اجزا وارد کیدی شي. ستاسو په پروژه کې دا یوځای کول خورا اسانه دي، یا هم د npm یا CDN په کارولو سره ترسره کیدی شي.

 

Buefy چمتو شوي UI اجزاوې، ترتیب، او شبیهونه وړاندې کوي. برخې کولی شي ستاسو موضوع ته SASS وکاروي. دا د عصري براوزرونو ملاتړ هم کوي.

 

9. Vue مواد

 

Vue مواد په پراخه کچه کارول شوي، لږ وزن لرونکي چوکاټ دی چې د موادو ډیزاین ځانګړتیاوې پلي کوي. دا د Vue.js او د موادو ډیزاین ځانګړتیاو ترمنځ یو له غوره ادغام څخه دی! تاسو کولی شئ دا د اسانه API له لارې ستاسو ټولو اړتیاو سره سم تنظیم کړئ.

 

دا د ټولو عصري ویب براوزرونو لپاره د ځواب ویونکي ډیزاین او ملاتړ سره مطابقت لري. کتابتون په موضوعاتو، اجزاوو، او UI عناصرو ویشل شوی دی. موضوعات د دې په اړه یو مشخص لارښود وړاندې کوي چې څنګه ستاسو غوښتنلیک ته موضوع ورکړئ (یا خپل موضوعات ولیکئ) او اجزاوې او UI عناصر د ترتیب ، نیویګیشن ، ټایپوګرافي ، شبیانو او 30 نورو برخو څخه جوړ دي. دا په ګیتوب کې شاوخوا 9.2k ستوري او 1.1k فورک لري او 21k + په اونۍ کې ډاونلوډونه NPM.

 

10. KeenUI

 

KeenUI یو لږ وزن لرونکی vue.js UI کتابتون دی چې د ساده API سره دی، د ګوګل د موادو ډیزاین څخه الهام اخیستل شوی. Keen UI د CSS چوکاټ ندی. له همدې امله، په دې کې د ګریډ سیسټم، ټایپوګرافي او نور لپاره سټایلونه شامل نه دي. پرځای یې، تمرکز په متقابل اجزاو باندې دی چې جاواسکریپټ ته اړتیا لري.

 

دا شاوخوا 30 د بیا کارونې وړ برخې لري. اجزا د SASS متغیرونو په کارولو سره د سټایلونو له مخې تنظیم کولو وړ دي. تاسو کولی شئ دا په خپله پروژه کې یا د CDN یا npm په کارولو سره مدغم کړئ. دا خلاص سرچینه ده او په ګیتوب کې شاوخوا 4k ستوري لري.

 

پایله

 

د UI برخې کتابتونونه یقینا د پروژې رامینځته کول خورا اسانه کوي. د سم انتخاب غوره کول د پروژې په ځانګړتیاو پورې اړه لري چې تاسو یې کار کول غواړئ. مخکې له دې چې یوې نوې پروژې ته لاړ شئ، د یو چا لپاره مشوره ورکول کیږي چې د UI برخې کتابتون بیاکتنه وکړي کوم چې د دې هدف لپاره غوره دی.