小程序引入第三方插件Vant和小程序WeUl组件库

Vant小程序组件

1、自己封装的gitee Vant
链接：https://vant-contrib.gitee.io/vant/#/zh-CN/
点击切换小程序

成功后就会看到 小程序Ul组件库

构建 npm 包
打开微信开发者工具，点击 工具 -> 构建 npm，并勾选 使用 npm 模块 选项，构建完成后，即可引入组件

引入在 app.wxss 中引入内置样式

@import '@vant/weapp/common/index.wxss';

例子：
需在创建的pages的目录中的文件夹以index为列子
引入“”搜索框”在index.json中引入组件，
index.json中

"usingComponents": {
  "van-search": "@vant/weapp/search/index"
}

index.wx.html中C+V组件

小程序WeUl组件库

1、创建文件夹打开cmd，在小程序根目录内，初始化npm

npm init -y

2、执行命令安装 npm 包：

以微信官方WEUI组件库为示例

npm install --save weui-miniprogram

3、安装完成后，在微信开发者工具中的菜单栏：详情-----使用npm模块-----工具 ------ 构建 npm ：

扫描二维码关注公众号，回复： 11581976 查看本文章

4、app.wxss引入全局样式

@import '/miniprogram_npm/weui-miniprogram/weui-wxss/dist/style/weui.wxss';

5、以pages的index为例，json中引入cell：

{
	  "usingComponents": {
		    "mp-cell": "../../miniprogram_npm/weui-miniprogram/cell/cell "
	   }
}

1

6、点击文档中的组件示例代码，开始 C + V

官方文档链接（这里是Slideview）：
链接: https://developers.weixin.qq.com/miniprogram/dev/extended/weui/slideview.html.