uniapp vue3版本+ts使用 vant小程序 组件库

1.首先从uniapp官网下载vue3版本+ts的模板

2.安装vant微信小程序版本

npm i @vant/weapp

3.在项目src目录创建wxcomponents文件夹,在wxcomponents文件夹下创建vant文件夹

4.从node_modules文件夹下的@vant文件夹里面的weapp,weapp下的dist文件夹,将dist文件夹里面的文件复制到/wxcomponents/vant

5.全局引用   在pages.json文件 ,  "globalStyle":{} 属性下加入以下片段,可按需引入具体需要全局引入的组件,引入规则如下:

注意引入路径需要改一下,改成正确的路径,如/wxcomponents/vant

"usingComponents": {
   "van-cell-group": "/wxcomponents/vant/cell-group/index",
   "van-field": "/wxcomponents/vant/field/index",
   //...
}

 例子

"globalStyle": {
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "uni-app",
    "navigationBarBackgroundColor": "#F8F8F8&
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值