DEV Community

Olivia
Olivia

Posted on

Vue 3 UI component library for 2021

Vue has released its 3.0 version while most of its ecosystem library such as UI component libraries are still under development to the new version.

Let see if there are some UI component libraries that work with Vue 3 for 2021 by comparing the development progress of the top 3 UI component libraries.

1. Element βœ…

Element Plus

Element is a UI component library for web developers and a design language for designers. It works with Vue’s Server-Side Rendering (SSR). Element also has a good community and regular updates.

As we could tell from it's Github, they have released a new version called Element Plus for Vue 3 😁. A production-ready version that we could use today.

Element Plus for Vue 3

2. Ionic βœ…

Ionic is an open-source mobile UI toolkit for building high quality, cross-platform native and web app experiences.

According to its website, Ionic Vue is built on top of Vue 3.0.0.

Alt Text

3. Primevue βœ…

Primevue is a simple to use, versatile, performant Vue UI Component Library to build stunning user interfaces.

According to its website, Primevue3 supports Vue 3.

Alt Text

4. Vuetify ❌

Vuetify is a framework over Vue, which lets you create clean, semantic, reusable UI components.

According to its website, the migration is still under development and we could use it in 2021 Q3 😭, which is a long time to wait.

Alt Text

5. Quasar ❌

Quasar is a front end framework based on Vue. You should consider it if you plan to work on the responsive web and mobile applications.

As mentioned on its Github, there's no release that works with Vue 3, however, there will be one soon in 2021 Q1πŸ˜₯.

Alt Text

At last, we've compared the top 3 UI component libraries and Element UI is the only winner that already supports Vue 3 at present. Wish other libraries in the Vue ecosystem could work harder to make it fully compatible with the new version of Vue.

Top comments (14)

Collapse
 
hawkeye64 profile image
Jeff Galbraith

Good news! Quasar is in beta and can be used today! It was held up from releasing out of beta because of SSR bugs in Vue 3, which were recently fixed. So, voila! Quasar release with fully implemented SSR, just yesterday. In 2 more weeks, it gets out of beta and full release mode.

Collapse
 
roblevintennis profile image
Rob Levin

Hi Olivia, may I suggest a library I recently released called AgnosticUI β€” agnosticui.com/

It's using Vue 3 and composition API!

πŸ”₯ Available in React, Vue 3, Angular, and Svelte
πŸ™Œ Vanilla JavaScript works too!! 😎
πŸ–ŒοΈ CSS custom properties-based theming
πŸ’ͺ Clean, semantic, and accessible HTML
πŸ’― Decoupled standards-based CSS (no preprocessing)

Collapse
 
pabloldias profile image
Pablo Lima Dias

Just yesterday I was checking on the availability of these libraries for Vue 3, for a new project I'll be working on!

I've used Element UI for years, but now I need more mobile-friendly components, so I'm willing to wait for Quasar and to use its revamped version.

Collapse
 
anthonygushu profile image
Anthony Gushu

Ionic is built on Vue 3! It's a great option for making native, cross-platform PWAs - kinda similar to Quasar

Collapse
 
olivia profile image
Olivia

added, thanks

Collapse
 
hawkeye64 profile image
Jeff Galbraith • Edited

Are you sure Element Plus is available?

Collapse
 
olivia profile image
Olivia

Yes, I've tried Element Plus with Vue 3, and looks great, you can check my note here dev.to/beccabycott/setup-vue3-with...

Collapse
 
arnurkuatov profile image
arnurkuatov

but It isn't supports TypeScript? Am I right?

Collapse
 
shanwshaw profile image
shawnshaw

is Element UI responsive? I used one project with Element UI and it works only on desktop, not on the phone for me.

Collapse
 
jenueldev profile image
Jenuel Oras Ganawed • Edited

add Naive-UI ,,, I have tried this component library and its really awesome. naiveui.com/

Collapse
 
avxkim profile image
Alexander Kim

According to Vuetify roodmap, they will support vue 3 in a february 2022.
Quasar is already done.

Collapse
 
vhatuncev profile image
Vasiliy Khatuntsev

There is one more components library for vue 3 naiveui.com/, worth to check

Collapse
 
aisone profile image
Info Comment hidden by post author - thread only accessible via permalink
Aaron Gong

Ant Design also Vue 3 beta or higher

Vuetify will take time as they have alot... to move over

Some comments have been hidden by the post's author - find out more