15 der interessantesten Vue UI-Komponentenbibliotheken für 2020

Interessante Vue UI-Komponentenbibliotheken


"Warum sich mit Vue UI-Komponentenbibliotheken beschäftigen??" Nun, Vue oder Vue.js ist eine beliebte JavaScript-Bibliothek, mit der Sie dynamische Anwendungen im Frontend erstellen können. Seit seinen bescheidenen Anfängen im Jahr 2014 hat es in den letzten zwei Jahren an Dynamik gewonnen. Vue hat sich als Hauptkonkurrent von Angular and React herausgestellt, und einer der Gründe für die Popularität von Vue ist die breite Verwendung von Komponenten, die die Entwicklung viel einfacher zu erfassen machen.

In diesem Beitrag, Wir behandeln einige der interessantesten Vue UI-Komponentenbibliotheken dass Sie zuerst untersuchen sollten. Sie werden sicherlich nützlich sein, wenn Sie eine Vue-Anwendung in Arbeit haben!

1. Vue Material Kit

vue material kit

Vue Material Kit ist eine großartige Verknüpfung, mit der Sie Ihren Design- / Entwicklungsprozess beim Erstellen neuer Websites oder Web-Apps beschleunigen können. Grundkenntnisse in JavaScript, Vuejs und Vue Router sind erforderlich, aber ansonsten ist das Paket ziemlich einfach zu verstehen und schön.

Das Kit enthält 60 handgefertigte Komponenten, zwei angepasste Plugins und drei Beispielseiten.

2. Vuetify

Vuetify Home Page

Vuetify ist ein Framework über Vue, mit dem Sie Erstellen Sie saubere, semantische und wiederverwendbare UI-Komponenten. Es funktioniert mit Vues Server Side Rendering (SSR)..

Was Vuetify zu einer interessanten Wahl unter den besten Vue UI-Komponentenbibliotheken macht, ist die Verfügbarkeit von vorgefertigten Gerüsten für Code – in Form von vorgefertigten Vue-Cli-Vorlagen. So können Sie schnell loslegen. Vuetify hat auch eine gute Community und regelmäßige Updates.

3. Buefy

Buefy

Buefy ist eine kompakte UI-Komponentenbibliothek, die auf Vue und basiert Bulma, ein CSS-Framework. Obwohl dieses Framework mit Bulma gebündelt ist, beträgt es weniger als 100 KB.

Wenn Sie mit SASS vertraut sind, werden Sie sich bei SASS wie zu Hause fühlen Buefys Ähnlichkeiten mit SASS. Obwohl Buefy eine vorgefertigte Liste von Komponenten für eine Anfängeranwendung bereitstellt, ist diese möglicherweise nicht ausreichend, wenn Sie an einem großen Projekt arbeiten.

4. Vue Material

Vue Material

Vue Material ist eine skalierbare Bibliothek, die mit den neuesten Designspezifikationen von Google erstellt wurde. Die Bibliothek enthält nützliche Komponenten um den Prozess der Erstellung komplexer App-Shells zu vereinfachen.

Mit über 1,7 Millionen Downloads bietet es eine kompakte Bibliothek zum Erstellen von Apps, die auf jeden Bildschirm passen. Die Vue Material-Bibliothek ist mit modernen Webbrowsern kompatibel und ihre API ist für Anfänger geeignet. Damit eignet sie sich perfekt für unsere 2020-Liste.

5. Fisch-UI

Fisch-Benutzeroberfläche

Fish UI ist ein leichtes Toolkit für die Vue UI-Komponentenbibliothek mit Unterstützung für Webpack und ES2015.

Zum Zeitpunkt des Schreibens hatte dieses Projekt nur fünf Mitwirkende. Im letzten Monat gab es jedoch einige Aktivitäten, was darauf hindeutet, dass es noch aktiv ist. Sie können zu gehen die Dokumentation des Projekts um es zu versuchen!

6. Quasar

Quasar

Quasar ist ein Front-End-Framework, das auf Vue basiert. Sie sollten dies in Betracht ziehen, wenn Sie an reaktionsschnellen Web- und Mobilanwendungen arbeiten möchten. Es ist ein vollwertiges Framework, das Funktionen wie Minimierung und Caching unterstützt – zusätzlich zu den Komponenten für Ihr Framework. Ab Mai 2020 ist es vorbei 14,6k Sterne auf GitHub.

Quasar ist möglicherweise die umfangreichste aller hier behandelten Vue UI-Komponentenbibliotheken. Es verfügt über eine ausführliche Dokumentation und eine robuste End-to-End-Implementierung.

7. Vux

Vux

Vux ist ein Framework, das auf WeChats WeUI und Webpack auf Vue basiert. Die Dokumentation ist jedoch hauptsächlich in Chinesisch mit minimaler englischer Übersetzung. Vux legt in erster Linie Wert auf die schnelle Entwicklung mobiler Komponenten für Ihre Anwendung.

Hier ist eine Live-Demo von Vux, das alle Komponenten und deren Rendering im Browser auflistet.

8. Element

Element

Element ist eine UI-Komponentenbibliothek für das Web, die auch Versionen für enthält Reagieren und Winkelig, zusätzlich zu Vue. Diese Komponentenbibliothek ist speziell auf Desktopanwendungen ausgerichtet, da ihre Komponenten nicht reagieren.

Element verfügt auch über umfangreiche Dokumentationen auf Chinesisch, obwohl spanische und englische Übersetzungen bereitgestellt werden. Nicht-chinesische Muttersprachler sollten das durchlaufen Internationalisierungsdokumentation bevor Sie Element in ihren Projekten verwenden.

9. Scharfe Benutzeroberfläche

Scharfe UI-Dokumentation

Im Gegensatz zu den meisten anderen in diesem Artikel vorgestellten Vue UI-Komponentenbibliotheken konzentriert sich Keen-UI eher auf die Interaktivität durch JavaScript als auf visuelle Komponenten. Keen-UI ist inspiriert von Googles Materialdesign, und kommt mit einer einfach zu bedienenden API.

Die scharfe Benutzeroberfläche bekräftigt nicht die Notwendigkeit, in Ihrer Anwendung verwendet zu werden, und verfügt über einige nützliche Komponenten, die strategisch platziert werden können, wo immer dies erforderlich ist. Daher ist Keen UI eine gute Wahl, wenn Sie einer vorhandenen Anwendung iterative Funktionen hinzufügen.

10. AT-UI

AT-UI

AT-UI ist eine weitere Vue UI-Komponentenbibliothek mit Schwerpunkt auf Desktop-Anwendungen.

AT-UI bietet flache UI-Komponenten für Ihre Webanwendungen. Es gibt 14 Mitwirkende und nicht viel Unterstützung, obwohl es gibt eine Starter-Vorlage auf GitHub können Sie verwenden.

11. Mint-UI

Mint-UI

Mint UI ist eine kompakte Vue UI-Komponentenbibliothek, die auf dem Babel JavaScript-Compiler basiert. Die geringe Größe dieses Pakets macht es für den Einsatz in mobilen Anwendungen geeignet. Die Mint-Benutzeroberfläche bietet ein iOS-ähnliches Thema für die Komponenten Ihrer Anwendung. Hier ist eine Demo der Mint UI-Komponenten.

Mint UI hat über 15.000 Sterne auf GitHub. Die Entwicklung des Frameworks ist noch in vollem Gange. Mitte Januar wurden neue Verpflichtungen für die Hauptniederlassung eingegangen. Ein kurzer Blick auf den Issue-Tracker auf GitHub zeigt jedoch, dass sich die Mint-Benutzeroberfläche vor allem an chinesische Entwickler richtet.

12. VuePress

VuePress

VuePress ist ein statischer Site-Generator, der auf Vue basiert. Dieses Framework verwendet Webpack, um vorgerenderte statische HTML-Seiten zu erstellen (wie wäre es mit statischen WordPress-Sites?), Was die Verarbeitung erheblich beschleunigt.

Die Verwendung von VuePress eröffnet Ihrem Projekt viele Möglichkeiten Automatisierung Ihres Dokumentationsprozesses. Es ist auch einfach in Ihre bestehende Anwendung zu integrieren. Ein erheblicher Nachteil ist jedoch, dass die SEO-Unterstützung noch neu ist und die Dokumentation konzentriert sich noch nicht auf dieses Thema.

13. Eagle.js

Eagle.js

Eagle.js ist ein Framework in Vue, mit dem Entwickler erstellen können eine Diashow innerhalb einer Webanwendung. In Eagle.js stehen viele Themen, Animationen, Widgets und Stile zur Auswahl und Anpassung.

Obwohl Eagle.js eine gute Anzahl von Beispielen auf der Demo-Site bietet, Dokumentation ist immer noch minimal. Die offensichtliche Alternative zu Eagle.js ist Reveal.js, Ein eigenständiges JavaScript-Framework für Web-Diashows. Eagle.js überwindet jedoch den größten Fehler mit Reveal.js – die Starrheit der Diashow-Struktur.

14. Bootstrap-Vue

Bootstrap-Vue

Bootstrap-Vue bringt die Leistung von Bootstrap, einer weit verbreiteten CSS-Bibliothek, in Vue. Es bietet Ihnen sofort verfügbare UI-Komponenten und ein Grid-System. Außerdem ist alles mobil und reaktionsschnell. Darüber hinaus sind die Komponenten dieser Bibliothek mit den WAI-ARIA-Richtlinien für die Barrierefreiheit im Internet kompatibel. Bootstrap-Vue entspricht der Philosophie von Bootstrap, schnell UI-Komponenten zu erstellen, und ermöglicht es Entwicklern, ein Projekt schnell zu starten.

Das Die Dokumentation ist umfangreich Die Community-Unterstützung ist stark, was es für jemanden zu einer sicheren Option macht, ein Projekt zu starten.

fünfzehn. iView-Benutzeroberfläche

iView-UI

iView UI ist eine Bibliothek in Vue, die UI-Komponenten und Widgets bereitstellt, wobei der Schwerpunkt auf einem übersichtlichen Design liegt. iView verfügt über ein eigenes CLI-Tool (Command Line Interface), iView-cli, Hier finden Sie ein visuelles Tool für das Gerüst von Komponenten und eine Offline-Version der Dokumentation. Es wird aktiv gepflegt, mit regelmäßige Updates Beheben von Fehlern und Hinzufügen von Funktionen.

Wenn Sie iView in Ihrem Projekt verwenden, finden Sie hier eine Starter-Kit, Dies hilft Ihnen beim Einstieg in die grundlegende Verwendung der Bibliothek.

Welche Vue UI-Komponentenbibliothek soll ausgewählt werden??

Wir haben hier 15 Vue UI-Komponentenbibliotheken aufgelistet, die verschiedene Funktionen ausführen. Aber welche ist die beste? Nun, die Antwort lautet wie immer "es hängt davon ab, ob." Wenn Sie eine vollständige Lösung wünschen, können Sie fortfahren und auswählen Quasar. Wenn Sie jedoch nach einer Plug-and-Play-Lösung für Ihre vorhandenen Projekte suchen, möchten Sie möglicherweise fortfahren Vuetify oder Scharfe Benutzeroberfläche.

Welche Vue UI-Komponentenbibliotheken verwenden Sie in Ihren Projekten? Lassen Sie es uns in Ihren Kommentaren unten wissen.

Diese Artikel könnten Sie auch interessieren:

  • Beste Angular Admin Dashboard-Vorlagen

Vergessen Sie nicht, an unserem Crashkurs teilzunehmen, um Ihre WordPress-Site zu beschleunigen. Mit einigen einfachen Korrekturen können Sie Ihre Ladezeit sogar um 50-80% reduzieren:

* Dieser Beitrag enthält Affiliate-Links. Wenn Sie also auf einen der Produktlinks klicken und dann das Produkt kaufen, erhalten wir eine geringe Gebühr. Keine Sorge, Sie zahlen trotzdem den Standardbetrag, sodass Sie keine Kosten haben.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map