When companies develop large projects, they often choose a suitable UI framework for rapid development. The biggest advantage of UI framework is that it can greatly save development time.

Therefore, before developing the project, we need to first understand the functional requirements and consider whether the UI framework we use can meet the functional requirements. For example, we cannot choose a PC UI framework for the mobile project.

So we need to be familiar with some UI frameworks so that we can select them before starting the project. Here are some of the free UI frameworks that support Vue3. You are welcome to talk more in the comments section!

Collect attention, hand stay fragrance!

I. UI framework commonly used on mobile terminals

1.1, uni – app

Liverpoolfc.tv: uniapp. Dcloud. IO/migration – t…

Uni-app is a framework for developing all front-end applications using vue.js. Developers write a set of code, which can be published to iOS, Android, Web (responsive), various small programs (wechat/Alipay/Baidu/Toutiao/Feishu /QQ/ Kuaishou/Dingding/Taobao), kuaiapp and many other platforms.

Advantages: not only support H5 applications, IOS, Android and small programs of various application platforms, a set of code to 13 platforms, this is not a dream. Not only the development efficiency is high, but also the maintenance is particularly convenient.

Uni-app in hand, you can do anything. The main reason is that it can withstand the test of enterprise projects, is used by many enterprises to develop commercial projects, the common applications are: CSDN, Open Source China, Zhang Liang Malatang, Migu Mall, China Unionpay and so on.

Generally speaking, when developing mobile terminal projects, the first framework that comes to mind is UNI-App. If we only make wechat mini program for the first time, and if we want to make Alipay or Tiktok mini program in the later stage, it is very convenient to expand, and there is no need to write another set of code according to other platforms.

1.2, Vant

Liverpoolfc.tv: youzan. Making. IO/vant/v3 / # / z…

Vant is a mobile component library open source by uzan front-end team. It is one of the mainstream mobile component libraries.

Vant not only offers Vue2 and Vue3 versions and wechat applet version support, but also React and Alipay applet versions.

Provides a lot of high-quality components, basically covering the mainstream mobile scenarios. Is a lightweight, reliable mobile component library, very recommended.

1.3, the Nut, the UI

Liverpoolfc.tv: nutui.jd.com/#/

Introduction: Developed by jingdong technical team, it supports not only VUe2 but also VUE3 mobile UI framework.

Advantages: not only support cutting-edge technology, can adapt to multi-terminal small program, component content is also rich, quality assurance. The unit test rate is more than 90%. Compatible with the current mainstream browser, support on-demand loading, support server side rendering. Supporting Webpack and Vite based building tools, you can quickly create a built-in vUE project of this component library.

1.4, Taro

Liverpoolfc.tv: taro-docs.jd.com/taro/docs/v…

Taro is an open cross-end cross-framework solution that supports the development of wechat, JD.com, Baidu, Alipay, Bytedance, QQ, Feishu, H5, RN and other applications using frameworks such as React, Vue, and Nerv.

Advantages: As with UNI-App, one set of code supports multi-terminal adaptation, greatly reducing development costs. Supports vue, VUe3, and React.

1.5. Taro UI Vue3

Introduction: Based on the development of Taro, using Vue 3.0 rewrite Taro UI component library, like Taro, a set of code can be run on multiple terminals.

Disadvantages: only vuE3 is supported.

Here are some mobile frameworks that only support vue2 versions below:

Muse – UI: muse-ui.org/#/zh-CN

Vux: doc. Vux. Li/useful – CN/about…

Mint – UI: mint – UI. Making. IO / #! /zh-cn

Cube UI: didi. Making. IO/Cube – UI / # / z…

If you are interested, you can check it out for yourself. This article mainly introduces the UI framework supporting VUE3.

2. PC UI framework

2.1、Ant Design Vue

Liverpoolfc.tv: next.antdv.com/components/…

Is a very mature framework for developing and serving enterprise-level backend products. Creating a user interface with Ant Design Vue is simple, as is using components that can be used in a variety of image styles, fonts, and black themes. The components basically cover most of the requirements of the project.

The official example is shown below:

Vue3’s Ant Design Vue framework offers significant improvements in performance, ease of use, functionality, smaller packages, lighter feel, and SSR support.

When using the framework, please switch to the documentation under vue3 version to prevent some problems such as component loading or event firing, and some apis have been removed and added after 2.x upgrade 3.x. Please refer to the official documentation for use.

Xiaobian often use this framework to develop the company’s background management projects, I feel pretty good!

, Element + 2.2

Liverpoolfc.tv: element – plus. Gitee. IO/useful – CN /

Ele. me’s front end team launched Element Plus, a Vue 3-based desktop component library for developers, designers, and product managers.

Bringing a lot of unobtrusive components to Vue3 creates a very complex application that basically meets the functional requirements. The official document is also written in particular, according to the document, can quickly start.

Element+ has 12.9K SATR on gitHub. Is becoming one of the most popular Vue3 UI frameworks on Github.

2.3, BalmUI

Liverpoolfc.tv: next-material.balmjs.com/#/

BalmUI is a modular and highly customizable Material Design UI library tailored for Vue.js 3.0, which has been updated to version 9.38.2.

Advantages: Balm not only comes with vUE plug-ins and instructions, but also provides some complex built-in instructions to achieve common effects, greatly reducing the workload. Update more frequently, do not worry about potential problems later difficult to solve.

Balm is a good choice if you are developing your project using VUE3.

2.4, Vuestic

Liverpoolfc.tv: vuestic. Dev/en/introduc…

A UI framework that supports VUE3 completely free of charge.

Advantages: Contains rich components, can meet the basic requirements of project development, allow global Settings CSS for global component style control, can support most browsers.

Disadvantages: Official documents do not support Chinese version, poor English to read the document is difficult.

2.5, Naive UI

Website: www.naiveui.com/zh-CN/os-th…

Naive UI is a vue3 component library written in typeScript and fast.

Benefits: Naive UI is written entirely in TypeScript and works seamlessly with your project. All components support tree shaking optimization, and the project runs smoothly and slightly faster. Rich in style compared to other components. I personally like these designs.

Disadvantages: Naive – UI supports only Vue3. If you are using Vue2, it is not supported.

Due to the short time of large-scale application of VUe3, there are few UI frameworks that can support VUe3 on mobile terminals. Compared with more frameworks that can support VUE3 on PC terminals, this article only introduces 5 PC frameworks.

If you have a recommended framework, feel free to leave a comment below.

Well xiaobian today’s article is over, like me can point a concern oh