Summary of common UI frameworks / component libraries for wechat applets

Time:2021-12-2

If you want to develop a set of high-quality small programs, using the framework, the component library is an indispensable part of saving time, effort and worry. With the increasing popularity of small programs, various types of small programs are gradually updated, including some excellent and easy-to-use framework / component libraries.

1: Weui applet – tutorial

https://weui.io/

Official introduction: weui is a basic style library consistent with the original visual experience of wechat. The wechat official design team has tailored the wechat internal web pages and wechat applets to make users’ perception of use more unified. A framework most commonly used in applet development is welcomed by the majority of developers.

Summary of common UI frameworks / component libraries for wechat applets

2: Meituan applet framework mpvue

Github:https://github.com/Meituan-Dianping/mpvue
Official website:http://mpvue.com/

Official introduction: mpvue is a front-end framework for developing small programs using vue.js. The framework is based on the core of vue.js. Mpvue modifies the runtime and compiler implementation of vue.js so that it can run in the applet environment, thus introducing a complete set of vue.js development experience for applet development.

Summary of common UI frameworks / component libraries for wechat applets

3: Component development framework wepy

GitHub address:
https://github.com/Tencent/wepy
Official website address:
https://tencent.github.io/wepy

Official introduction: component-based development perfectly solves the problems of component isolation, component nesting, component communication, etc., supports the use of third-party NPM resources, automatically handles the dependencies between NPM resources, and is perfectly compatible with all NPM resource packages without platform dependency

Summary of common UI frameworks / component libraries for wechat applets

4: Official framework Mina

Address:https://developers.weixin.qq.com/miniprogram/dev/framework/MINA.html

Official introduction: the framework provides its own view layer description languages wxml and wxss, as well as the logic layer framework based on JavaScript, and provides data transmission and event system between the view layer and the logic layer, so that developers can easily focus on data and logic.

Summary of common UI frameworks / component libraries for wechat applets

5: Tina.js a lightweight progressive wechat applet framework

Tina.js open source framework address:https://github.com/tinajs/tina

Official introduction: it is a lightweight and progressive wechat applet framework, which retains most of the API design of Mina (official framework of wechat applet); Whether you have experience in small program development or not, you can transition easily.

Summary of common UI frameworks / component libraries for wechat applets

6: Front end framework Web

Address:https://github.com/wdfe/weweb

Official introduction: weweb is a front-end framework compatible with applet syntax. You can use the writing method of applet to write web applications. If you already have an applet, you can run your applet in the browser through it.

7: Wechat UI component library iView Web

https://weapp.iviewui.com/

Introduction: iView web provides a UI consistent with iView and the same interface name as possible, which greatly reduces the learning cost. It is a set of high-quality wechat applet UI component library.

Summary of common UI frameworks / component libraries for wechat applets

8: Zanui weapp — a wechat applet UI library with high appearance, easy to use and easy to expand

https://cnodejs.org/topic/589d625a5c8036f7019e7a4a

Official introduction: zanui weapp combines the visual specifications of wechat to provide users with a more unified experience. It contains 17 types of components or elements, such as badge, BTN, etc.

9: Uniapp — an easy-to-use framework for multi terminal mixed development, familiar with a highly applicable framework

Frame address:https://uniapp.dcloud.io/collocation/pages
Document address:https://uniapp.dcloud.io/README
Appropriate ide:HbuilderYou can directly use the IDE to package the corresponding required end code
Official introduction: development once, covering multiple terminals