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

 更新时间:2019年08月01日 16:40:53   作者:无枉少年  
这篇文章主要给大家介绍了关于微信小程序npm引入vant-weapp的踩坑记录,文中通过示例代码介绍的非常详细,对大家学习或者使用微信小程序具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧

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

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

npm i vant-weapp -S --production 

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


没有找到npm包

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

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

然后一直按回车

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

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

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

错误1


大概意思-找不到组件

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

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

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

错误2

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

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

引入成功

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

总结

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

相关文章

  • 关于Javascript作用域链的八点总结

    关于Javascript作用域链的八点总结

    其实吧,关于作用域链相关的文章我也看了不少,但是我一直也没能做一个详细的总结,今天把我看到的一些东西,结合自己的想法,总结成以下8个点
    2013-12-12
  • js 第二代身份证号码的验证机制代码

    js 第二代身份证号码的验证机制代码

    在盛大某网站注册的时候,身份证必填,但我又不想填真实身份证号码,于是随便编了串自认为合法的身份证号码,但是却马上被提示号码错误
    2011-05-05
  • JavaScript 一道字符串分解的题目

    JavaScript 一道字符串分解的题目

    要求用js写一个函数,对传入的形如下网址字符串,返回对应的对象。
    2011-08-08
  • JavaScript使用FileReader实现图片上传预览效果

    JavaScript使用FileReader实现图片上传预览效果

    这篇文章主要为大家详细介绍了JavaScript使用FileReader实现图片上传预览效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-09-09
  • Javascript Request获取请求参数如何实现

    Javascript Request获取请求参数如何实现

    使用Javascript Request获取参数的时候总是提示出错,本文为此问题提供详细的解决方案,需要了解的朋友可以参考下
    2012-11-11
  • IE及IE6浏览器中判断JS文件加载成功失败的方法

    IE及IE6浏览器中判断JS文件加载成功失败的方法

    这篇文章主要介绍了IE及IE6浏览器中判断JS文件加载成功失败的方法,本文使用vbscript来解决这个问题,需要的朋友可以参考下
    2015-02-02
  • JavaScript中var let const的用法有哪些区别

    JavaScript中var let const的用法有哪些区别

    在ES6(ES2015)出现之前,JavaScript中声明变量就只有通过var关键字,函数声明是通过function关键字,而在ES6之后,声明的方式有var、let、const、function、class,本文主要讨论var、let和const之间的区别
    2021-10-10
  • javascript控制层显示或隐藏的方法

    javascript控制层显示或隐藏的方法

    这篇文章主要介绍了javascript控制层显示或隐藏的方法,涉及javascript操作页面元素样式的相关技巧,非常简单实用,需要的朋友可以参考下
    2015-07-07
  • es6 symbol的实现方法示例

    es6 symbol的实现方法示例

    这篇文章主要介绍了es6 symbol的实现方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • JavaScript设计模式之装饰者模式介绍

    JavaScript设计模式之装饰者模式介绍

    这篇文章主要介绍了JavaScript设计模式之装饰者模式介绍,通一个类来动态的对另一个类的功能对象进行前或后的修饰,给它辅加一些额外的功能; 这是对一个类对象功能的装饰,装饰的类跟被装饰的类,要求拥有相同的访问接口方法(功能),需要的朋友可以参考下
    2014-12-12

最新评论