Vant Weapp 是有赞前端团队开源的一套小程序 UI 组件库,助力开发者快速搭建小程序应用。它所使用的是 MIT 开源许可协议,对商业使用比较友好,官网地址:https://vant-contrib.gitee.io/vant-weapp/#/home
安装 Vant 组件库
在小程序项目中,安装 Vant 组件库主要分为如下 3 步:
https://vant-contrib.gitee.io/vant-weapp/0.x/#/quickstart
① 通过 npm 安装
npm init -y
npm i vant-weapp -S --production
② 构建 npm 包
③ 修改 app.json
// app.json
"usingComponents": {
"van-button": "vant-weapp/button"
}
若有需要,可在 app.wxss 中引入内置样式
@import "miniprogram_npm/vant-weapp/common/index.wxss";
使用组件
引入组件后,可以在 wxml 中直接使用组件
<van-button type="primary">按钮</van-button>