uniapp引入vant

踩坑实践
1.下载hbuilder或者hbuilderX中创建一个默认模版的项目

2.在项目中创建一个文件叫wxcomponents，注意这个文件和page文件平级

3.打开https://github.com/youzan/vant-weapp，找到

4.下载以后，解压，找到文件中的dist文件，把它复制到我们创建的wxcomponents文件，重新命名为vant

5.然后我们在page.json中全局配置一下

6.然后我们就可以在页面中使用了

7.然后运行发现报错了,报错原因是应为font字体识别的问题，解决办法，我们全局搜索一下https://img.yzcdn.cn/vant/vant-icon-d3825a.woff，然后在文件的第二个开始的url前面加上一个空格就好了

8.例如，我这里截图改了一个，要全部加上空格哦

9.运行编译成功，好了可以放心使用了

10.第5条是博主碰到的问题，用vue的引入方法也试了，可惜没有解决，所以还是用了uniapp中自带的扩展组件，已解决，感谢评论区的大佬

uniapp引入vant相关推荐

uniapp 引入vant 2 报错 require is not defined
uniapp 引入vant 2 报错 require is not defined 一.Vue 2 项目,安装 Vant 2 npm i vant@latest-v2 二.main.js 导入Vant ...
关于uniapp引入Vant Weapp第三方组件，遇到的问题和解决方式
1.在根目录下创建wxcomponents 2.引入vant weapp 1.我们到https://github.com/youzan/vant-weapp下载最新的压缩包 2. 解压,将里面的dis ...
小程序(uniapp) | 引入Vant Weapp
1.找到项目的文件夹,输入cmd 打开终端 2.进入vant官网:Vant Weapp - 轻量.可靠的小程序 UI 组件库先初始化npm init, 再根据 # 通过 npm 安装 npm i @ ...
uniapp引入 vant
一.下载vant源码方式一:从 Vant 官网首页进入 GitHub下载对应版本的压缩包,将文件解压后备用,确保下载的压缩包里有dist 文件夹方式二:通过npm install 方式引入 npm ...
uni-app 引入**vant，colorUI,uView等并发布H5端
以下以vant为例,发布H5 轻量.可靠的移动端 Vue 组件库,采用 MIT 开源协议, 目前github star 数9k+,是有赞的一套开源组件库.通过 Vant,可以快速搭建出风格统一的页面, ...
uniapp引入vant组件
Vant官网https://youzan.github.io/vant/#/zh-CN/ 点击官网右上角跳转到小程序版vant(方便查看文档) 1.在根目录下创建一个文件夹格式如下wxcompone ...
uniapp引入vantweapp踩坑笔记
vue-cli创建uniapp项目引入vantweapp踩坑笔记 uni-app中引入vantweapp vue-cli创建uniapp项目引入vantweapp踩坑笔记一.环境准备二.项目搭建 ...
Uniapp 导入 Vant 组件库
Uniapp 导入 Vant 组件库 Vant Weapp 开发文档 Vant Weapp - 轻量.可靠的小程序 UI 组件库创建 wxcomponents 目录在 uniapp 项目的根目录下 ...
uniapp使用Vant ui
uniapp项目中如何使用Vant ui uniapp常用框架有很多,例如uview,colorUI,当然还有dcloud团队打造的插件库等等.一般手机App开发使用这些框架或者组件库已经足够了.但是 ...

uniapp引入vant

uniapp引入vant相关推荐

最新文章

热门文章