微信小程序使用Vant Weapp组件库的方法步骤


Posted in Javascript onAugust 01, 2019

微信小程序使用Vant Weapp组件库的方法步骤

地址:https://youzan.github.io/vant/#/zh-CN/intro

一.引入Vant组件库

1.首先运行 npm init

微信小程序使用Vant Weapp组件库的方法步骤

微信小程序使用Vant Weapp组件库的方法步骤

就会生成 package.json

微信小程序使用Vant Weapp组件库的方法步骤

2.运行

npm i vant-weapp -S --production

 微信小程序使用Vant Weapp组件库的方法步骤

微信小程序使用Vant Weapp组件库的方法步骤 

3.安装成功后 点击 工具 => 构建npm

微信小程序使用Vant Weapp组件库的方法步骤

之后点击 详情 => 使用构建npm 渲染

微信小程序使用Vant Weapp组件库的方法步骤

二.使用组件库

首先在json文件中引入组件

微信小程序使用Vant Weapp组件库的方法步骤

"van-button": "vant-weapp/button"

之后可以在官网找到想要用的组件使用

微信小程序使用Vant Weapp组件库的方法步骤 

微信小程序使用Vant Weapp组件库的方法步骤 

报错码

VM292:1 thirdScriptError sdk uncaught third Error module "miniprogram_npm/vant-weapp/mixins/transition" is not defined Error: module "miniprogram_npm/vant-weapp/mixins/transition" is not defined at require (http://127.0.0.1:56368/appservice/__dev__/WAService.js:22:26700) at http://127.0.0.1:56368/appservice/__dev__/WAService.js:22:26448 at http://127.0.0.1:56368/appservice/miniprogram_npm/vant-weapp/popup/index.js:5:19 at require (http://127.0.0.1:56368/appservice/__dev__/WAService.js:22:26841) at <anonymous>:395:7 at HTMLScriptElement.scriptLoaded (http://127.0.0.1:56368/appservice/appservice?t=1557802464868:4544:21) at HTMLScriptElement.script.onload (http://127.0.0.1:56368/appservice/appservice?t=1557802464868:4556:20) 

解决方法:

你只需要把miniprogram_npm/vant-weapp里的组件文件夹都删除,

之后再https://github.com/youzan/vant-weapp下载一份vant, 将dist文件夹(vant-weapp-dev\vant-weapp-dev\dist)中的文件复制到项目的miniprogram_npm/vant-weapp

即下载一份vant,之后替换掉项目中的文件

之后保存解决

微信小程序使用Vant Weapp组件库的方法步骤

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
Display SQL Server Version Information
Jun 21 Javascript
基于MooTools的很有创意的滚动条时钟动画
Nov 14 Javascript
JS 表单验证大全
Nov 23 Javascript
javascript jscroll模拟html元素滚动条
Dec 18 Javascript
关于IE BUG与字符串截取substr的解决办法
Apr 10 Javascript
登陆成功后自动计算秒数执行跳转
Jan 23 Javascript
JQuery 控制内容长度超出规定长度显示省略号
May 23 Javascript
浅谈JSON和JSONP区别及jQuery的ajax jsonp的使用
Nov 23 Javascript
javascript引用类型指针的工作方式
Apr 13 Javascript
javascript类型系统 Window对象学习笔记
Jan 07 Javascript
Bootstrap Tree View简单而优雅的树结构组件实例解析
Jun 15 Javascript
JS写XSS cookie stealer来窃取密码的步骤详解
Nov 20 Javascript
微信小程序中button去除默认的边框实例代码
Aug 01 #Javascript
vue-router两种模式区别及使用注意事项详解
Aug 01 #Javascript
jQuery中DOM常见操作实例小结
Aug 01 #jQuery
JS浮点数运算结果不精确的Bug解决
Aug 01 #Javascript
微信小程序动画组件使用解析,类似vue,且更强大
Aug 01 #Javascript
vue项目中全局引入1个.scss文件的问题解决
Aug 01 #Javascript
jQuery中DOM操作原则实例分析
Aug 01 #jQuery
You might like
虫族 Zerg 历史背景
2020/03/14 星际争霸
用php解析html的实现代码
2011/08/08 PHP
php中获得视频时间总长度的另一种方法
2011/09/15 PHP
BOOM vs RR BO5 第三场 2.14
2021/03/10 DOTA
javascript import css实例代码
2008/07/18 Javascript
10个新的最有前途的JavaScript框架
2009/03/12 Javascript
FF(火狐)浏览器无法执行window.close()解决方案
2014/11/13 Javascript
JavaScript关联数组用法分析【概念、定义、遍历】
2017/03/15 Javascript
bootstrap multiselect 多选功能实现方法
2017/06/05 Javascript
JS检测是否可以访问公网服务器功能代码
2017/06/19 Javascript
vue-router中的hash和history两种模式的区别
2018/07/17 Javascript
详解小程序退出页面时清除定时器
2019/04/28 Javascript
js模拟F11页面全屏显示
2019/09/17 Javascript
js实现简单页面全屏
2019/09/17 Javascript
vue中使用element ui的弹窗与echarts之间的问题详解
2019/10/25 Javascript
angular8和ngrx8结合使用的步骤介绍
2019/12/01 Javascript
Python PyAutoGUI模块控制鼠标和键盘实现自动化任务详解
2018/09/04 Python
深入浅析Python 中 is 语法带来的误解
2019/05/07 Python
利用python计算windows全盘文件md5值的脚本
2019/07/27 Python
使用python远程操作linux过程解析
2019/12/04 Python
Python Sympy计算梯度、散度和旋度的实例
2019/12/06 Python
pandas中ix的使用详细讲解
2020/03/09 Python
宝塔面板成功部署Django项目流程(图文)
2020/06/22 Python
pytorch SENet实现案例
2020/06/24 Python
python使用多线程查询数据库的实现示例
2020/08/17 Python
HTML5新特性之type=file文件上传功能
2018/02/02 HTML / CSS
学生干部的自我评价分享
2014/01/18 职场文书
《桂林山水》教学反思
2014/02/08 职场文书
计算机通信专业推荐信
2014/02/22 职场文书
护士感人事迹
2014/05/01 职场文书
幼儿教师求职信
2014/05/24 职场文书
兵马俑导游词
2015/02/02 职场文书
庐山导游词
2015/02/03 职场文书
完美处理python与anaconda环境变量的冲突问题
2021/04/07 Python
Python基础详解之描述符
2021/04/28 Python
nginx静态资源的服务器配置方法
2022/07/07 Servers