最近用了几个月的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. php sprintf() 函数把格式化的字符串写入一个变量中。

    来源:https://blog.csdn.net/zxh1220/article/details/79709207 HP sprintf() 函数用到的参数 printf — 输出格式化字符串 spr ...

  2. VideoView--简单的设置全屏幕播放

    我说的最主要的是要在布局哪里设置一下,如: <com.example.mypalyer.fullScreen          android:id="@+id/videoView1& ...

  3. (五)PL/SQL条件控制

    简述 决策结构需要程序员指定一个或多个条件要计算,或由程序进行测试,如果条件被确定为真那么一条或多条语句被执行,如果要被执行的其它语句条件被确定为假,则选其它执行块. PL/SQL编程语言提供了以下几 ...

  4. 用百度AI平台接口实现OCR文字识别

    目录 一.接入指南 1.注册 2.登录 3.创建应用 二.安装接口模型 三.编写python代码 四.识别结果 一.接入指南 若想利用百度AI开放平台进行软件开发,首先应成为百度AI开放平台的开发者. ...

  5. QT踩坑记录1-多线程信号与槽

    QT踩坑记录1-多线程信号与槽 QTC++Bugs 错误输出 无错误输出, 但是声明了信号的连接,但是无法使用 程序中就是无命令 介绍 QT 典型程序 #include <QObject> ...

  6. java 中的fork join框架

    文章目录 ForkJoinPool ForkJoinWorkerThread ForkJoinTask 在ForkJoinPool中提交Task java 中的fork join框架 fork joi ...

  7. shell基础知识DAY2

    1.管道符(|):把一个命令的输出,把输出的内容传递给管道符后面命令的输入.如:ls -l | grep "^[^d]".2.jobs作业控制,后台运行bg PID,前台运行fg ...

  8. vue elementui table 双击单元格实现编辑,聚焦,失去焦点,显示隐藏input和span

    <el-table :data="tableData" class="tb-edit" style="width: 100%" ref ...

  9. 图论--2-SAT--HDU/HDOJ 1814 Peaceful Commission

    Peaceful Commission Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Oth ...

  10. MySQL 中 on与where筛选条件的区别

    在两张表连接的时候才会有on的筛选条件,那么on和where的区别是什么呢? 在inner join中是没有区别的,但是在左连接和右连接中,区别就体现出来了,下面以左连接为例: 1.用on的时候,只对 ...