1、hbuilder新建一个vue2的项目
2、项目中引入vant-weapp组件
- 在vant-weapp的GitHub Releases版块下载最新的zip包
- 解压下载文件,将dist目录下面的文件拷贝到刚才创建vant目录中
3、在App.vue引入组件库样式
@import "/wxcomponents/vant/common/index.wxss";
4、在pages.json里面注册组件
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8",
"usingComponents": {
"van-button": "/wxcomponents/vant/button/index"//按需引入组件
}
},
//easycom配置
"easycom": {
"autoscan": true,
"custom": {
"van-(.*)": "@/wxcomponents/vant/$1/index"
}
},
5、单个页面按需引入组件
{
"path": "pages/index/index",
"style": {
"usingComponents":{
"van-button": "/wxcomponents/vant/button/index"
},
"navigationBarTitleText": "首页"
}
}