使用npm引用第三方组件库
2019-07-06 本文已影响0人
渺渺兮余木
npm安装教程只需跟着步骤操作就行
1、首先在小程序文件夹miniprogram上,右击,选择在终端打开。
图片.png2、输入npm init进行初始化
图片.png3、之间回车,默认处理,最后选择yes
图片.png4、然后在miniprogram文件夹下会自动生成一个package.json文件
图片.png5、通过官方网站获取组件库(以Vant Weapp为例)
Vant Weapp官网
将命令
npm i vant-weapp -S --production
复制到终端,执行,执行完成
图片.png
图片.png
6、在WeChat中,点击工具->构建npm,会在miniprogram文件夹下生成miniprogram_npm这个包,其中为Vant组件库;再点击详情->使用npm模块
图片.png7、例:在pages/index页面中使用Vant组件
图片.png在pages/index/index.json中引入Vant中 button组件
图片.png图片.png
在index.wxml中使用button组件
"../../miniprogram/miniprogram_npm/vant-weapp/button"
图片.png
图片.png