• Stars
    star
    1,719
  • Rank 25,955 (Top 0.6 %)
  • Language
    JavaScript
  • License
    Other
  • Created almost 8 years ago
  • Updated 12 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

An efficient front-end framework for developers building UI on the web.

Banner

QMUI Web Version Number

一个旨在提高 UI 开发效率、快速产生项目 UI 的前端框架

官网:http://qmuiteam.com/web

下载 Demo:https://github.com/QMUI/QMUIDemo_Web/releases

[English] / [简体中文] / [繁體中文]

Build Status Build status QMUI Team Name License

QMUI Web 是一个专注 Web UI 开发,帮助开发者快速实现特定的一整套设计的框架。框架主要由一个强大的 SASS 方法合集与内置的工作流构成。通过 QMUI Web,开发者可以很轻松地提高 Web UI 开发的效率,同时保持了项目的高可维护性与稳健。如果你需要方便地控制项目的整体样式,或者需要应对频繁的界面变动,那么 QMUI Web 框架将会是你最好的解决方案。

功能特性

基础配置与组件

通过内置的公共组件和对应的 SASS 配置表,你只需修改简单的配置即可快速实现所需样式的组件。(QMUI SASS 配置表和公共组件如何帮忙开发者快速搭建项目基础 UI?

SASS 增强支持

QMUI Web 包含70个 SASS mixin/function/extend,涉及布局、外观、动画、设备适配、数值计算以及 SASS 原生能力增强等多个方面,可以大幅提升开发效率。

完善的内置工作流

QMUI Web 内置的工作流拥有从初始化项目到变更文件的各种自动化处理,包含了模板引擎,雪碧图处理,图片集中管理与自动压缩,静态资源合并、压缩与变更以及冗余文件清理等功能。

扩展组件

QMUI Web 除了内置的公共组件外,还通过扩展的方式提供了常用的扩展组件,如等高左右双栏,文件上传按钮,树状选择菜单。

环境配置

请确保安装 Node.js(建议 14.0 或以上版本),并用以下命令全局安装 gulp:

#安装 gulp
npm install --global gulp

快速开始

推荐使用 Yeoman 脚手架 generator-qmui 安装和配置 QMUI Web。该工具可以帮助你完成 QMUI Web 的所有安装和配置。

#安装 Yeoman,如果本地已安装可以忽略
npm install -g yo
#安装 QMUI 的模板
npm install -g generator-qmui
#在项目根目录执行以下命令
yo qmui

效果预览

完成后生成的项目目录结构

项目根目录
├─public          // 静态资源目录,由 gulp 生成
│  ├─js           // 静态资源 js 文件
│  └─style        // 静态资源 UI 文件
│     ├─css       // 静态资源 css 文件
│     └─images    // 静态资源 images 文件
├─UI_dev          // 实际进行开发的样式目录
│  ├─project      // 项目相关 SASS 与 images 文件,由 gulp 生成
│  │  ├─images    // 项目相关图片文件
│  │  ├─logic     // 项目相关逻辑样式
│  │  └─widget    // 项目相关公共组件样式
│  └─qmui_web     // QMUI Web 主源码应放置在这一层目录
├─UI_html         // 静态模板目录
└─UI_html_result  // 静态模板 gulp 处理后的版本,用于前端拼接最终的模板

对于需要有更强定制性的开发者,请参考创建新项目(高级)

工作流任务列表

#在 UI_dev/qmui_web 中执行以下命令可以查看工作流的任务列表及说明
gulp list

也可以查看文档中的详细说明

完善框架

如果有意见反馈或者功能建议,欢迎创建 Issue 或发送 Pull Request,调试与修改框架请先阅读文档,感谢你的支持和贡献。

设计稿 Sketch 源文件可在 Dribbble 上获取。

QMUI Web Desktop

推荐配合使用的桌面 App:QMUI Web Desktop。它可以管理基于 QMUI Web 进行开发的项目,通过 GUI 界面处理 QMUI Web 的服务开启/关闭,使框架的使用变得更加便捷,并提供了编译提醒,出错提醒,进程关闭提醒等额外的功能。

QMUI Web Desktop

More Repositories

1

weui

A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.
Less
27,053
star
2

wepy

小程序组件化开发框架
JavaScript
22,396
star
3

ncnn

ncnn is a high-performance neural network inference framework optimized for the mobile platform
C++
18,267
star
4

mars

Mars is a cross-platform network component developed by WeChat.
C++
17,089
star
5

tinker

Tinker is a hot-fix solution library for Android, it supports dex, library and resources update without reinstall apk.
Java
17,033
star
6

MMKV

An efficient, small mobile key-value storage framework developed by WeChat. Works on Android, iOS, macOS, Windows, and POSIX.
C++
16,576
star
7

APIJSON

🏆 零代码、全功能、强安全 ORM 库 🚀 后端接口和文档零代码,前端(客户端) 定制返回 JSON 的数据和结构。 🏆 A JSON Transmission Protocol and an ORM Library 🚀 provides APIs and Docs without writing any code.
Java
16,474
star
8

vConsole

A lightweight, extendable front-end developer tool for mobile web page.
TypeScript
16,379
star
9

weui-wxss

A UI library by WeChat official design team, includes the most useful widgets/modules.
Less
14,966
star
10

QMUI_Android

提高 Android UI 开发效率的 UI 库
Java
14,312
star
11

rapidjson

A fast JSON parser/generator for C++ with both SAX/DOM style API
C++
13,803
star
12

secguide

面向开发人员梳理的代码安全指南
13,014
star
13

omi

Web Components Framework - Web组件框架
TypeScript
12,869
star
14

VasSonic

VasSonic is a lightweight and high-performance Hybrid framework developed by tencent VAS team, which is intended to speed up the first screen of websites working on Android and iOS platform.
Java
11,745
star
15

matrix

Matrix is a plugin style, non-invasive APM system developed by WeChat.
Java
11,335
star
16

wcdb

WCDB is a cross-platform database framework developed by WeChat.
C
9,963
star
17

xLua

xLua is a lua programming solution for C# ( Unity, .Net, Mono) , it supports android, ios, windows, linux, osx, etc.
C
8,995
star
18

libco

libco is a coroutine library which is widely used in wechat back-end service. It has been running on tens of thousands of machines since 2013.
C++
7,998
star
19

Hippy

Hippy is designed to easily build cross-platform dynamic apps. 👏
C++
7,789
star
20

Shadow

零反射全动态Android插件框架
Java
7,167
star
21

QMUI_iOS

QMUI iOS——致力于提高项目 UI 开发效率的解决方案
Objective-C
7,010
star
22

MLeaksFinder

Find memory leaks in your iOS app at develop time.
Objective-C
5,384
star
23

lemon-cleaner

腾讯柠檬清理是针对macOS系统专属制定的清理工具。主要功能包括重复文件和相似照片的识别、软件的定制化垃圾扫描、可视化的全盘空间分析、内存释放、浏览器隐私清理以及设备实时状态的监控等。重点聚焦清理功能,对上百款软件提供定制化的清理方案,提供专业的清理建议,帮助用户轻松完成一键式清理。
Objective-C
5,166
star
24

kbone

一个致力于微信小程序和 Web 端同构的解决方案
JavaScript
4,727
star
25

libpag

The official rendering library for PAG (Portable Animated Graphics) files that renders After Effects animations natively across multiple platforms.
C++
4,655
star
26

puerts

PUER(普洱) Typescript. Let's write your game in UE or Unity with TypeScript.
C++
4,543
star
27

GT

GT (Great Tit) is a portable debugging tool for bug hunting and performance tuning on smartphones anytime and anywhere just as listening music with Walkman. GT can act as the Integrated Debug Environment by directly running on smartphones.
Java
4,383
star
28

TNN

TNN: developed by Tencent Youtu Lab and Guangying Lab, a uniform deep learning inference framework for mobile、desktop and server. TNN is distinguished by several outstanding features, including its cross-platform capability, high performance, model compression and code pruning. Based on ncnn and Rapidnet, TNN further strengthens the support and performance optimization for mobile devices, and also draws on the advantages of good extensibility and high performance from existed open source efforts. TNN has been deployed in multiple Apps from Tencent, such as Mobile QQ, Weishi, Pitu, etc. Contributions are welcome to work in collaborative with us and make TNN a better framework.
C++
4,256
star
29

westore

小程序项目分层架构
JavaScript
4,200
star
30

tmagic-editor

TypeScript
4,017
star
31

vap

VAP是企鹅电竞开发,用于播放特效动画的实现方案。具有高压缩率、硬件解码等优点。同时支持 iOS,Android,Web 平台。
Objective-C
3,766
star
32

wujie

极致的微前端框架
TypeScript
3,663
star
33

phxpaxos

The Paxos library implemented in C++ that has been used in the WeChat production environment.
C++
3,301
star
34

WeFlow

A web developer workflow tool by WeChat team based on tmt-workflow, with cross-platform supported and environment ready.
JavaScript
3,224
star
35

weui.js

A lightweight javascript library for WeUI.
JavaScript
3,154
star
36

cherry-markdown

✨ A Markdown Editor
JavaScript
3,122
star
37

spring-cloud-tencent

Spring Cloud Tencent is a Spring Cloud based Service Governance Framework provided by Tencent.
Java
3,107
star
38

tencent-ml-images

Largest multi-label image database; ResNet-101 model; 80.73% top-1 acc on ImageNet
Python
3,048
star
39

tdesign

Enterprise Design System
Vue
2,971
star
40

VasDolly

Android V1 and V2 Signature Channel Package Plugin
Java
2,970
star
41

PhoenixGo

Go AI program which implements the AlphaGo Zero paper
C++
2,853
star
42

FaceDetection-DSFD

腾讯优图高精度双分支人脸检测器
Python
2,845
star
43

Tendis

Tendis is a high-performance distributed storage system fully compatible with the Redis protocol.
C++
2,817
star
44

PocketFlow

An Automatic Model Compression (AutoMC) framework for developing smaller and faster AI applications.
Python
2,774
star
45

behaviac

behaviac is a framework of the game AI development, and it also can be used as a rapid game prototype design tool. behaviac supports the behavior tree, finite state machine and hierarchical task network(BT, FSM, HTN)
C#
2,758
star
46

MSEC

Mass Service Engine in Cluster(MSEC) is opened source by QQ team from Tencent. It is a backend DEV &OPS engine, including RPC,name finding,load balance,monitoring,release and capacity management.
Java
2,749
star
47

phxsql

A high availability MySQL cluster that guarantees data consistency between a master and slaves.
C++
2,463
star
48

OOMDetector

OOMDetector is a memory monitoring component for iOS which provides you with OOM monitoring, memory allocation monitoring, memory leak detection and other functions.
Objective-C++
2,290
star
49

tsf

coroutine and Swoole based php server framework in tencent
PHP
2,180
star
50

tmt-workflow

A web developer workflow used by WeChat team based on Gulp, with cross-platform supported and solutions prepared.
CSS
2,175
star
51

Hardcoder

Hardcoder is a solution which allows Android APP and Android System to communicate with each other directly, solving the problem that Android APP could only use system standard API rather than the hardware resource of system.
C++
2,136
star
52

LKImageKit

A high-performance image framework, including a series of capabilities such as image views, image downloader, memory caches, disk caches, image decoders and image processors.
Objective-C
2,080
star
53

TubeMQ

TubeMQ has been donated to the Apache Software Foundation and renamed to InLong, please visit the new Apache repository: https://github.com/apache/incubator-inlong
2,030
star
54

UnLua

A feature-rich, easy-learning and highly optimized Lua scripting plugin for UE.
C++
2,010
star
55

ObjectDetection-OneStageDet

单阶段通用目标检测器
Python
1,956
star
56

cloudbase-framework

腾讯云开发云原生一体化部署工具 🚀 CloudBase Framework:一键部署,不限框架语言,云端一体化开发,基于Serverless 架构。A front-end and back-end integrated deployment tool. One-click deploy to serverless architecture. https://docs.cloudbase.net/framework/index
JavaScript
1,931
star
57

InjectFix

InjectFix is a hot-fix solution library for Unity
C#
1,921
star
58

phxrpc

A simple C++ based RPC framework.
C++
1,905
star
59

soter

A secure and quick biometric authentication standard and platform in Android held by Tencent.
Java
1,896
star
60

phxqueue

A high-availability, high-throughput and highly reliable distributed queue based on the Paxos algorithm.
C++
1,891
star
61

plato

腾讯高性能分布式图计算框架Plato
C++
1,885
star
62

TscanCode

A static code analyzer for C++, C#, Lua
C++
1,868
star
63

GameAISDK

基于图像的游戏AI自动化框架
C++
1,818
star
64

TSW

Tencent Server Web
TypeScript
1,800
star
65

MedicalNet

Many studies have shown that the performance on deep learning is significantly affected by volume of training data. The MedicalNet project provides a series of 3D-ResNet pre-trained models and relative code.
Python
1,793
star
66

NeuralNLP-NeuralClassifier

An Open-source Neural Hierarchical Multi-label Text Classification Toolkit
Python
1,741
star
67

Biny

Biny is a tiny, high-performance PHP framework for web applications
PHP
1,689
star
68

sluaunreal

lua dev plugin for unreal engine 4 or 5
C++
1,664
star
69

paxosstore

PaxosStore has been deployed in WeChat production for more than two years, providing storage services for the core businesses of WeChat backend. Now PaxosStore is running on thousands of machines, and is able to afford billions of peak TPS.
C++
1,651
star
70

Metis

Metis is a learnware platform in the field of AIOps.
Python
1,634
star
71

CodeAnalysis

Static Code Analysis - 静态代码分析
Python
1,563
star
72

TurboTransformers

a fast and user-friendly runtime for transformer inference (Bert, Albert, GPT2, Decoders, etc) on CPU and GPU.
C++
1,426
star
73

TencentOS-kernel

腾讯针对云的场景研发的服务器操作系统
1,401
star
74

nohost

基于 Whistle 实现的多账号多环境远程配置及抓包调试平台
JavaScript
1,377
star
75

TBase

TBase is an enterprise-level distributed HTAP database. Through a single database cluster to provide users with highly consistent distributed database services and high-performance data warehouse services, a set of integrated enterprise-level solutions is formed.
C
1,366
star
76

WeDemo

WeDemo为微信团队开源项目,用于帮助微信开发者完成微信登录、微信分享等功能的接入和开发。开发者可参考源代码完成开发,也可以直接将代码应用到自己的App开发中,安全、便捷地在App中实现微信分享、微信登录功能。
Objective-C
1,354
star
77

feflow

🚀 A command line tool aims to improve front-end engineer workflow and standard, powered by TypeScript.
TypeScript
1,352
star
78

GAutomator

Automation for mobile games
Objective-C
1,297
star
79

tdesign-vue-next

A Vue3.x UI components lib for TDesign.
TypeScript
1,294
star
80

flare

Flare是广泛投产于腾讯广告后台的现代化C++开发框架,包含了基础库、RPC、各种客户端等。主要特点为易用性强、长尾延迟低。
C++
1,241
star
81

FeatherCNN

FeatherCNN is a high performance inference engine for convolutional neural networks.
C++
1,206
star
82

TFace

A trusty face analysis research platform developed by Tencent Youtu Lab
Python
1,203
star
83

LuaPanda

lua debug and code tools for VS Code
Lua
1,201
star
84

tdesign-miniprogram

A Wechat MiniProgram UI components lib for TDesign.
HTML
1,053
star
85

tgfx

A lightweight 2D graphics library for rendering texts, geometries, and images with high-performance APIs that work across various platforms.
C++
998
star
86

RapidView

RapidView is an android ui and lightapp development framework
Java
978
star
87

TencentPretrain

Tencent Pre-training framework in PyTorch & Pre-trained Model Zoo
Python
953
star
88

FAutoTest

A UI automated testing framework for H5 and applets
Python
927
star
89

TencentKona-8

Tencent Kona is a no-cost, production-ready distribution of the Open Java Development Kit (OpenJDK), Long-term support(LTS) with quarterly updates. Tencent Kona serves as the default JDK internally at Tencent Cloud for cloud computing and other Java applications.
Java
906
star
90

tdesign-vue

A Vue.js UI components lib for TDesign.
TypeScript
862
star
91

hel

A module federation SDK which is unrelated to tool chain for module consumer. 工具链无关的运行时模块联邦sdk.
JavaScript
861
star
92

Pebble

Pebble分布式开发框架
C++
861
star
93

tquic

A high-performance, lightweight, and cross-platform QUIC library
Rust
839
star
94

mxflutter

使用 TypeScript/JavaScript 来开发 Flutter 应用的框架。
Dart
818
star
95

Face2FaceTranslator

面对面翻译小程序是微信团队针对面对面沟通的场景开发的流式语音翻译小程序,通过微信同声传译插件提供了语音识别,文本翻译等功能。
JavaScript
804
star
96

tdesign-react

A React UI components lib for TDesign.
TypeScript
779
star
97

DCache

A distributed in-memory NOSQL system based on TARS framework, support LRU algorithm and data persists on back-end database. Users can easily deploy, publish, and scale services on the web interface.
C++
747
star
98

Real-SR

Real-World Super-Resolution via Kernel Estimation and Noise Injection
Python
740
star
99

PatrickStar

PatrickStar enables Larger, Faster, Greener Pretrained Models for NLP and democratizes AI for everyone.
Python
734
star
100

HaboMalHunter

HaboMalHunter is a sub-project of Habo Malware Analysis System (https://habo.qq.com), which can be used for automated malware analysis and security assessment on the Linux system.
Python
721
star