最近用了几个月的wepy框架,碰到了挺多问题,这里总结一下

1.clone的代码无法再本地运行,wepy报错
 解决方案:

执行命令 : `npm install wepy-cli@1.6.1-alpha4 -g`

2.使用vant ui框架时 custom-class中定义的 样式类不生效。

解决方案 :在style标签中 取消scoped 属性。

3.分包问题

在构建项目时一定要提前打好分包。 小程序分包的限制为2M ,总项目大小不能超过8M,那么就是3个分包和一个主包。

vant-weapp的大小为1.3M左右。各种图片资源也占了不少地方。我还引进了echarts的图表组件,大概0.7M,腾讯地图cdk .2M

解决方案:

 建议静态的资源单独放在一个分包中,图片资源放在服务器上,onload时加载。      tabbar的页面必须放在主包中。各种封装的公共api放在主包中。不同的模块放在分包中

大体目录如下:

src

---components   //组件

---config    //打包及基础配置

---pages  //页面

  --main  //login及tabbar页面

  --packageA //存放一些静态文件和外部文件

  --packageB //模块1

  --packageC//模块2

  --index.wpy//开发时的入口文件

---servers//封装 request 请求 阿里云网关加密方法 通用的api等等

---store//redux的store

---app.wpy //设置globalData    全局的app.json  也可以设置拦截器(wepy提供的拦截器)

4.自定义的tabbar
   微信小程序不推荐自定义的tabbar

 如果自己开发一个tabbar的组件 在页面中引入的话,由于是跳页的问题,tabbar会闪一下,对客户的体验不好

 这里提供一个 tabbar的解决方案:

思路:自定义的tabbar和官方的tabbar同时存在,在页面的onShow时隐藏官方的tabbar
具体实现参考这篇文章https://www.cnblogs.com/yk95/p/9597493.html

  

做出来大概是这个效果

今天先到这里吧,有空再更了

wepy+vant-weapp踩坑记的更多相关文章

  1. mpvue-Vant Weapp踩坑记

    微信开发者工具:开发.调试和模拟运行微信小程序的最核心的工具了,所以必须安装 # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 mpvue- ...

  2. Spark踩坑记——Spark Streaming+Kafka

    [TOC] 前言 在WeTest舆情项目中,需要对每天千万级的游戏评论信息进行词频统计,在生产者一端,我们将数据按照每天的拉取时间存入了Kafka当中,而在消费者一端,我们利用了spark strea ...

  3. Spark踩坑记——数据库(Hbase+Mysql)

    [TOC] 前言 在使用Spark Streaming的过程中对于计算产生结果的进行持久化时,我们往往需要操作数据库,去统计或者改变一些值.最近一个实时消费者处理任务,在使用spark streami ...

  4. 【踩坑记】从HybridApp到ReactNative

    前言 随着移动互联网的兴起,Webapp开始大行其道.大概在15年下半年的时候我接触到了HybridApp.因为当时还没毕业嘛,所以并不清楚自己未来的方向,所以就投入了HybridApp的怀抱. Hy ...

  5. Spark踩坑记——共享变量

    [TOC] 前言 Spark踩坑记--初试 Spark踩坑记--数据库(Hbase+Mysql) Spark踩坑记--Spark Streaming+kafka应用及调优 在前面总结的几篇spark踩 ...

  6. Spark踩坑记——从RDD看集群调度

    [TOC] 前言 在Spark的使用中,性能的调优配置过程中,查阅了很多资料,之前自己总结过两篇小博文Spark踩坑记--初试和Spark踩坑记--数据库(Hbase+Mysql),第一篇概况的归纳了 ...

  7. djangorestframework+vue-cli+axios,为axios添加token作为headers踩坑记

    情况是这样的,项目用的restful规范,后端用的django+djangorestframework,前端用的vue-cli框架+webpack,前端与后端交互用的axios,然后再用户登录之后,a ...

  8. HttpWebRequest 改为 HttpClient 踩坑记-请求头设置

    HttpWebRequest 改为 HttpClient 踩坑记-请求头设置 Intro 这两天改了一个项目,原来的项目是.net framework 项目,里面处理 HTTP 请求使用的是 WebR ...

  9. vue踩坑记

    vue踩坑记 易错点 语法好难啊qwq 不要把'data'写成'date' 在v-html/v-bind中使用vue变量时不需要加变量名 在非vue事件中使用vue中变量时需要加变量名 正确 < ...

  10. 【bug记录】OS Lab4 踩坑记

    OS Lab4 踩坑记 Lab4在之前Lab3的基础上,增加了系统调用,难度增加了很多.而且加上注释不详细,开玩笑的指导书,自己做起来困难较大.也遇到了大大小小的bug,调试了一整天. 本文记录笔者在 ...

随机推荐

  1. Spring Cloud微服务技术概览

    Spring Cloud 是一系列框架的有序集合.它利用 Spring Boot 的开发便利性巧妙地简化了分布式系统基础设施的开发,如服务发现注册.配置中心.消息总线.负载均衡.断路器.数据监控等,都 ...

  2. Jenkins(2)- 更改插件源为国内源

    如果想从头学起Jenkins的话,可以看看这一系列的文章哦 https://www.cnblogs.com/poloyy/category/1645399.html jenkins插件清华大学镜像地址 ...

  3. 作业九——DFA最小化,语法分析初步

  4. 2019-2020-1 20199325《Linux内核原理与分析》第三周作业

    在实验楼当中进行实验3的实践:主要是针对cpu占用分配,使用时间片轮转算法进行分配 在Shell命令当中输入如下代码: $ cd ~/LinuxKernel/linux-3.9.4 $ rm -rf ...

  5. Android:RelativeLayout 内容居中

    Android RelativeLayout 内容居中解决办法: 使用Linearlayout本来利用父控件的gravity属性是很好解决的.但是对应RelativeLayout虽然有gravity属 ...

  6. Linux系统管理第四次作业 磁盘管理 文件系统

    1.为主机新增两块30GB的SCSI硬盘 2.划分3个主分区,各5GB,剩余空间作为扩展分区 [root@localhost ~]# fdisk /dev/sdb 欢迎使用 fdisk (util-l ...

  7. itchat学习

    itchat是一个开源的微信个人号接口,可以很方便的使用python调用微信. 教程如下:https://itchat.readthedocs.io/zh/latest/ 简单试玩了一下,觉得还挺有趣 ...

  8. JAVA第二次blog总结

    JAVA第二次blog总结 0.前言 这是我们在博客园上第二次写博客,进行JAVA阶段学习的总结.现在我们接触到JAVA已经有一段时间了,但难点还是在于编程思想和方法的改变,第二阶段的学习让我对于理解 ...

  9. RobotFrameWork 自动化环境搭建(基于 python2.7)

    1.自动化工具安装顺序 robot Framework(两个RF框架) WXpython(不要更改安装路径,自动安装在python文件中) 安装依赖库 RF3.0 和 RF1.5.2.1 打开 rid ...

  10. kafka简介及集群部署

    消息队列概念:(Message queue): “消息”是在两台计算机间传送的数据单位.消息可以非常简单,例如只包含文本字符串:也可以更复杂,可能包含嵌入对象. “消息队列”是在消息的传输过程中保存消 ...