Getting familiar with Vuikit.
Vuikit is a MIT licensed Vue UI library based on UIkit. In other words, Vuikit fulfills the necessity of a consistent and responsive library for building web site interfaces.
YOOtheme, the team behind UIkit, is doing a fantastic job maintaining one of the most popular front-end framework. Their expertise from building themes for Joomla! and WordPress can be very well felt and enjoyed while integrating UIkit.
When Vue entered the scene to change the way we do JavaScript, YOOtheme was one of the first teams to embrace it and integrate it within their products. But underneath, UIkit was still running the show with it own code logic. While that might be the best option for them it is not from a Vue library perspective.
The gap between Vue and UIkit was obvious and knowing that the solution would not be brought by the core team, Vuikit has emerged as an independent project that port and extend UIkit to the world of Vue.
Choosing the right library for the project at hand is not easy, the following list highlights some of the benefits of Vuikit that might help you with the task.
Open Source and free
This is true for most libraries but not all of them. Knowing that the code will be always available and open-sourced is important.
Front-end framework
As Vuikit is based on UIkit it automatically inherits all its framework features. You will need nothing else for developing fast and powerful web interfaces.
Stays out of the way
It provides a collection of components and directives and leaves everything else to you. Once registered globally or locally, they are ready to use.
Extendible
One of the main reasons we all fall in love with Vue is it endless possibilities, and Vuikit definitely doesn't put any constraints to that. In the following sections there are details and best practices about how and when to extend the library.
Themeable
Default styles are provided out of the box which are a standard UIkit theme, meaning that you can use a custom UIkit theme instead and all the components will behave the same.
Vuikit browser compatibility is tightly coupled to what Vue and UIkit are supporting, which can be summarized to:
![]() | ![]() | ![]() | ![]() | ![]() | ![]() |
---|---|---|---|---|---|
Latest | Latest | Latest | 11+ | 9.1+ | Latest |