微信小程序npm引入vant-weapp的踩坑记录


Posted in Javascript onAugust 01, 2019

微信小程序项目使用npm安装vant-weapp的正确步骤 

使用npm安装vant-weapp 到项目根目录下:

npm i vant-weapp -S --production

然后再详情中选中使用npm模块,然后点击工具栏中的构建npm。本以为这样就可以安装成功了,结果

微信小程序npm引入vant-weapp的踩坑记录
没有找到npm包

这让我纠结了一个早上。看了文档,琢磨了很久,最后研究出问题的关键。

第一步:使用cmd进入项目根目录:npm init

然后一直按回车

第二步:输入你要安装的文件(npm i vant-weapp -S --production 

如果已经之前安装了vant-weapp的,就直接到工具栏中选中构建npm就可以了,如果没有就安装好再选中构建npm。

微信小程序npm引入vant-weapp的踩坑记录

我以为这样就可以使用vant-weapp框架了,然后刷新项目,问题来了。。。

错误1

微信小程序npm引入vant-weapp的踩坑记录
大概意思-找不到组件

明明步骤都对了,却还是出错。然后就网上找找问题。网上说:

解决方法:
你只需要把miniprogram_npm/vant-weapp里的组件文件夹都删除,
之后再https://github.com/youzan/vant-weapp下载一份vant, 将dist文件夹(vant-weapp-dev\vant-weapp-dev\dist)中的文件复制到项目的miniprogram_npm/vant-weapp
原文:https://3water.com/article/166771.htm

还有就是重新安装vant-weapp。重新安装是可以的,不会报错。

错误2

引入页面的的.json一定要写对,不然也会报错。

{
 "usingComponents": {
 "van-button": "vant-weapp/button" //添加这个
  }
}

微信小程序npm引入vant-weapp的踩坑记录

引入成功

emmmmm,问题不断,战火不熄,BUG之路还在继续。

总结

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

Javascript 相关文章推荐
js弹窗代码 可以指定弹出间隔
Jul 03 Javascript
jquery禁用右键示例
Apr 28 Javascript
如何实现chrome浏览器关闭页面时弹出“确定要离开此面吗?”
Mar 05 Javascript
PhotoSwipe异步动态加载图片方法
Aug 25 Javascript
jQuery使用getJSON方法获取json数据完整示例
Sep 13 Javascript
BootStrap实现带关闭按钮功能
Feb 15 Javascript
详解angularJS动态生成的页面中ng-click无效解决办法
Jun 19 Javascript
JavaScript函数绑定用法实例分析
Nov 14 Javascript
JS中touchstart事件与click事件冲突的解决方法
Mar 12 Javascript
详解在create-react-app使用less与antd按需加载
Dec 06 Javascript
el-input 标签中密码的显示和隐藏功能的实例代码
Jul 19 Javascript
通过js随机函数Math.random实现乱序
May 19 Javascript
vue3.0中的双向数据绑定方法及优缺点
Aug 01 #Javascript
微信小程序导入Vant报错VM292:1 thirdScriptError的解决方法
Aug 01 #Javascript
微信小程序使用Vant Weapp组件库的方法步骤
Aug 01 #Javascript
微信小程序中button去除默认的边框实例代码
Aug 01 #Javascript
vue-router两种模式区别及使用注意事项详解
Aug 01 #Javascript
jQuery中DOM常见操作实例小结
Aug 01 #jQuery
JS浮点数运算结果不精确的Bug解决
Aug 01 #Javascript
You might like
收集的二十一个实用便利的PHP函数代码
2010/04/22 PHP
PHP 5.3新增魔术方法__invoke概述
2014/07/23 PHP
PHP获取指定月份第一天和最后一天的方法
2015/07/18 PHP
PHP使用GD库输出汉字的方法【测试可用】
2016/11/10 PHP
PHP实现上传图片到数据库并显示输出的方法
2018/05/31 PHP
extjs 学习笔记(一) 一些基础知识
2009/10/13 Javascript
IE8 中使用加速器(Activities)
2010/05/14 Javascript
jquery实现的带缩略图的焦点图片切换(自动播放/响应鼠标动作)
2013/01/23 Javascript
浅谈Javascript 执行顺序
2013/12/18 Javascript
轻松创建nodejs服务器(1):一个简单nodejs服务器例子
2014/12/18 NodeJs
jquery控制页面部分刷新的方法
2015/06/24 Javascript
基于JS实现的倒计时程序实例
2015/07/24 Javascript
jquery限定文本框只能输入数字(整数和小数)
2016/01/08 Javascript
浅谈JavaScript中面向对象的的深拷贝和浅拷贝
2016/08/01 Javascript
jQuery Easyui使用(二)之可折叠面板动态加载无效果的解决方法
2016/08/17 Javascript
Angular2学习笔记之数据绑定的示例代码
2018/01/03 Javascript
jQuery实现点击自身以外区域关闭弹出层功能完整示例【改进版】
2018/07/31 jQuery
小程序实现左滑删除功能
2018/10/30 Javascript
JavaScript实现10秒后再次获取验证码
2020/12/02 Javascript
Python 基础教程之str和repr的详解
2017/08/20 Python
Odoo中如何生成唯一不重复的序列号详解
2018/02/10 Python
python3获取当前文件的上一级目录实例
2018/04/26 Python
Python读取YUV文件,并显示的方法
2018/12/04 Python
python文字转语音的实例代码分析
2019/11/12 Python
kafka-python 获取topic lag值方式
2019/12/23 Python
带你彻底搞懂python操作mysql数据库(cursor游标讲解)
2020/01/06 Python
python数据预处理 :样本分布不均的解决(过采样和欠采样)
2020/02/29 Python
python多线程实现同时执行两个while循环的操作
2020/05/02 Python
英国标志性奢侈品牌:Burberry
2016/07/28 全球购物
bareMinerals官网:矿物质化妆品和护肤品
2018/02/04 全球购物
阿根廷首家户外用品制造商和经销商:Montagne
2018/02/12 全球购物
化石印度尼西亚在线商店:Fossil Indonesia
2019/03/11 全球购物
金融行业务员的自我评价
2013/12/13 职场文书
计算机多媒体专业自荐信
2014/07/04 职场文书
毕业实习证明范本
2015/06/16 职场文书
Zabbix对Kafka topic积压数据监控的问题(bug优化)
2022/07/07 Servers