微信小程序开发--ui库插件

常用ui组件库：

1. WeUI 满足基础的界面需求

官方WeUI组件库

2. Vant 组件库

由有赞发布，想制作一款电商、餐饮、外卖平台、票务预订等购物类小程序，选用 Vant 是较为合适的
文档

3. iViewUI

是由 TalkingData 发布的组件库
官网

WeUI 组件库的使用

（默认已创建项目）
（*里面的icon需要自己放到对应地址才能使用，无语住了。。。）

1. 安装nodejs

（具体不详细说明了）

2. 安装weui

进入项目目录下，打开终端，执行

npm --v // 查看node安装是否成功
npm init
npm install weui-miniprogram --save // 下载安装weui

3. 构建npm

左上角 工具 -->构建npm
如果报错提示找不到文件：在下面文件里加入框内配置代码再进行构建

  "packNpmManually": true,
    "packNpmRelationList": [
      {
        "packageJsonPath": "./package.json",
        "miniprogramNpmDistDir": "./miniprogram/"
      }
    ] ,

4. 在app.wxss或是app.scss中引入weui

// 固定的，不需要改
@import '/miniprogram_npm/weui-miniprogram/weui-wxss/dist/style/weui.wxss';

iviewUI组件库的使用 具体参考官网

1.安装引入

到 GitHub 下载 iView Weapp 的代码，将 dist 目录拷贝到自己的项目中

2.添加需要的组件。

在页面的 json 中配置（路径根据自己项目位置配置）：

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

2. 在 wxml 中使用组件

<i-button type="primary" bind:click="handleClick">这是一个按钮</i-button>