新建项目
打开微信开发者工具,项目->新建项目,输入目录名称和小程序id
命令行进入到微信小程序的目录
引用流程参考
https://vant-contrib.gitee.io/vant-weapp/#/quickstart
但是按照该页面介绍操作的话，会提示【没有找到可以构建的NPM包，请确认需要参与构建的npm。。。。】
npm init #一路回车npm i @vant/weapp -S --production将 app.json 中的 "style": "v2" 去除project.config.json中的setting模块，设置packNpmManually为true，packNpmRelationList中新增对象{"packageJsonPath": "./package.json", "miniprogramNpmDistDir": "./"}{"setting": {
.............................
"packNpmManually": true,
"packNpmRelationList": [{
"packageJsonPath": "./package.json",
"miniprogramNpmDistDir": "./"
}],},启用npm模块,最新版的微信开发者工具并没有这个配置，但是在最新版本中不配置【使用npm模块】也可以正常构建npm
文章图片
构建npm
工具->构建npm
项目根目录会新增miniprogram_npm目录
文章图片
app.json中新增vant模块
"usingComponents": {
"van-button": "@vant/weapp/button/index"
}wxml中使用vant组件
主要按钮
{{motto}}
效果
文章图片
如果上传到git，然后下载，此时node_moudles目录应该被ignore的，命令行进入git clone下载的目录后需要执行npm install
【微信小程序|微信小程序集成vant】
推荐阅读
- 毕业设计系列|毕设讲解之 --- 如何完成小程序毕业设计
- 餐饮小程序都需要哪些功能
- 微信小程序 分享页面做登录拦截采坑记录
- 一文看懂小程序开发费用明细
- 小程序开通分销功能有什么优势
- 微信小程序|基于微信小程序的移动智能学习平台的设计开发和实现
- 企业为什么要开发小程序
- 微信小程序开发|mac 上用charles 抓包pc端微信小程序
- 代付|微信公众号如何实现支付功能（）