使用npm引用第三方组件库

npm安装教程只需跟着步骤操作就行

1、首先在小程序文件夹miniprogram上,右击,选择在终端打开。

图片.png

2、输入npm init进行初始化

图片.png

3、之间回车,默认处理,最后选择yes

图片.png

4、然后在miniprogram文件夹下会自动生成一个package.json文件

图片.png

5、通过官方网站获取组件库(以Vant Weapp为例)

Vant Weapp官网
将命令
npm i vant-weapp -S --production
复制到终端,执行,执行完成

图片.png

图片.png

图片.png

6、在WeChat中,点击工具->构建npm,会在miniprogram文件夹下生成miniprogram_npm这个包,其中为Vant组件库;再点击详情->使用npm模块

图片.png

7、例:在pages/index页面中使用Vant组件

图片.png

在pages/index/index.json中引入Vant中 button组件

图片.png

图片.png

在index.wxml中使用button组件

"../../miniprogram/miniprogram_npm/vant-weapp/button"
图片.png

图片.png
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容