Wux Weapp

一套组件化、可复用、易扩展的微信小程序 UI 组件库。(A set of componentized, reusable, and easily extensible WeChat app UI components library.)

Github星跟蹤圖

Wux Weapp

一套组件化、可复用、易扩展的微信小程序 UI 组件库

npm version

快速上手

使用之前

在开始使用之前,你需要先阅读 微信小程序自定义组件 的相关文档。

如何使用

  1. 通过 npm 安装,需要依赖小程序基础库 2.2.1 以上版本,同时依赖开发者工具的 npm 构建。具体详情可查阅 官方 npm 文档
  2. 通过 GitHub 下载 Wux Weapp 的代码,然后 将 dist/ 目录拷贝到自己的项目中。按照如下的方式使用组件,以 Button 为例,其它组件在对应的文档页查看:
  • dist/ - 压缩版(ES5)
  • example/dist/ - 未压缩版(ES6,使用时需要开启 ES6 转 ES5,位于开发者工具右上角-详情-本地配置)

在 page.json 中引入组件

"usingComponents": {
    "wux-button": "../../dist/button/index"
}

在 page.wxml 中使用组件

<wux-button size="small" />
<wux-button size="default" />
<wux-button size="large" />

组件库文件体积过大的问题

随着组件库越来越丰富,文件的体积也越来越大,某些时候我们可能只需要其中的一个或多个组件,如果直接引入整个组件库的话是不合适的,这时候就需要我们将要使用到组件给单独抽离出来,也很简单直接拷贝 dist/ 目录下对应的组件即可,当然某些组件存在依赖关系,则抽离过程会相对复杂一些,以 ActionSheet、Badge、Button 为例。

demo/

主要指標

概覽
名稱與所有者wux-weapp/wux-weapp
主編程語言JavaScript
編程語言JavaScript (語言數: 4)
平台微信公众平台, Mac, Windows
許可證MIT License
所有者活动
創建於2017-01-10 03:12:26
推送於2024-04-25 10:22:39
最后一次提交2024-04-25 18:22:40
發布數44
最新版本名稱v3.11.3 (發布於 2024-04-25 00:50:44)
第一版名稱v1.1.8 (發布於 )
用户参与
星數5.1k
關注者數153
派生數879
提交數665
已啟用問題?
問題數391
打開的問題數29
拉請求數18
打開的拉請求數1
關閉的拉請求數17
项目设置
已啟用Wiki?
已存檔?
是復刻?
已鎖定?
是鏡像?
是私有?