创建miniprogram文件夹
进入miniprogram文件夹,执行安装命令
npm i @vant/weapp -S --production
勾选“使用npm模块”
微信开发者工具>>设置>>项目设置
构建npm
微信开发者工具>>工具>>构建npm
出现上图就是构建成功了,构建成功之后会出现miniprogram_npm文件夹
引入vant样式
在app.wxss引入样式(官网是这样写的)
@import '@vant/weapp/common/index.wxss'
由于我在项目使用了less,所以我是在app.less文件中引入的
@import 'miniprogram_npm/@vant/weapp/common/index.wxss';
关于引入路径:官网写的路径会找不到,写了绝对路径就ok了
引入组件
在app.json或者需要调用组件的页面.json文件中引入
"usingComponents": {
"van-action-sheet": "@vant/weapp/action-sheet/index"
}