详解vue 项目白屏解决方案


Posted in Javascript onOctober 31, 2018

在做的项目是使用 vue-cli 脚手架为基础的,只能使用微信浏览器打开的。在某次更新功能代码后,被反馈在一些手机上会出现白屏。经过一番探索,多管齐下解决了问题

白屏可能的原因:

  1. es6 代码没有被编译成 es5 ;
  2. 文件打包路径错误;
  3. 运营商塞入的广告 js 服务器报错,连累项目不能下载资源;

针对 1 和 2 ,分别采取以下做法:

解决位置:config/index.js 文件:把 assetsPublicPath: '/' 改为assetsPublicPath: './'

build: {
  assetsPublicPath: './',
}

解决位置:

首先安装 babel-polyfill 库;

npm install --save babel-polyfill

然后修改 build/webpack.base.conf.js 文件,将

entry: {
  app: './src/main.js',
 }

改成

entry: ['babel-polyfill', './src/main.js']

使得其从入口文件就开始转换代码。

做了上面的操作后,问题就解决了,因此没有对 3 进行实践。

3 的情况,是以前的经验之谈。部分用户出现了打不开页面的情况,刚好同事的手机也遇到同样的情况,拿来分析之后发现,是运营商劫持了流量,往里面塞了广告 js ,结果它的服务器还出错.....解决方案是上 https ,完美解决。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Extjs学习笔记之一 初识Extjs之MessageBox
Jan 07 Javascript
showModalDialog模态对话框的使用详解以及浏览器兼容
Jan 11 Javascript
Jquery中巧用Ajax的beforeSend方法
Jan 20 Javascript
JavaScript队列的应用实例详解【经典数据结构】
Apr 12 Javascript
layDate日期控件使用方法详解
Nov 15 Javascript
JS/jQuery实现超简单的Table表格添加,删除行功能示例
Jul 31 jQuery
Vue代码整洁之去重方法整理
Aug 06 Javascript
微信小程序webview与h5通过postMessage实现实时通讯的实现
Aug 20 Javascript
解决vue的过渡动画无法正常实现问题
Oct 31 Javascript
JS实现数据动态渲染的竖向步骤条
Jun 24 Javascript
Node.js web 应用如何封装到Docker容器中
Sep 01 Javascript
Javascript节流函数throttle和防抖函数debounce
Dec 03 Javascript
微信小程序ibeacon三点定位详解
Oct 31 #Javascript
小程序获取周围IBeacon设备的方法
Oct 31 #Javascript
详解js删除数组中的指定元素
Oct 31 #Javascript
Vue中使用方法、计算属性或观察者的方法实例详解
Oct 31 #Javascript
Vue项目History模式404问题解决方法
Oct 31 #Javascript
Vue.js中对css的操作(修改)具体方式详解
Oct 30 #Javascript
vue组件中的样式属性scoped实例详解
Oct 30 #Javascript
You might like
MVC模式的PHP实现
2006/10/09 PHP
Yii框架数据模型的验证规则rules()被执行的方法
2016/12/02 PHP
PHP html_entity_decode()函数讲解
2019/02/25 PHP
Thinkphp5框架实现图片、音频和视频文件的上传功能详解
2019/08/27 PHP
PHP扩展安装方法步骤解析
2020/11/24 PHP
JavaScript Cookie显示用户上次访问的时间和次数
2009/12/08 Javascript
js中onload与onunload的使用示例
2013/08/25 Javascript
使用mini-define实现前端代码的模块化管理
2014/12/25 Javascript
jQuery Validate表单验证插件 添加class属性形式的校验
2016/01/18 Javascript
JS判断元素是否在数组内的实现代码
2016/03/30 Javascript
javascript弹出窗口中增加确定取消按钮
2016/06/24 Javascript
JS实现给对象动态添加属性的方法
2017/01/05 Javascript
微信小程序  checkbox组件详解及简单实例
2017/01/10 Javascript
Bootstrap导航简单实现代码
2017/03/06 Javascript
Node.js和Express简单入门介绍
2017/03/24 Javascript
浅谈关于iview表单验证的问题
2018/09/29 Javascript
node使用async_hooks模块进行请求追踪
2021/01/28 Javascript
[42:35]2018DOTA2亚洲邀请赛3月30日 小组赛A组 VG VS OpTic
2018/03/31 DOTA
详细介绍Python中的偏函数
2015/04/27 Python
详解duck typing鸭子类型程序设计与Python的实现示例
2016/06/03 Python
python中异常报错处理方法汇总
2016/11/20 Python
浅谈Python中的私有变量
2018/02/28 Python
解读python logging模块的使用方法
2018/04/17 Python
Django restframework 源码分析之认证详解
2019/02/22 Python
OpenCV图像颜色反转算法详解
2019/05/13 Python
python 协程 gevent原理与用法分析
2019/11/22 Python
Python数组并集交集补集代码实例
2020/02/18 Python
创建青年文明号材料
2014/05/09 职场文书
小学阳光体育活动总结
2014/07/05 职场文书
罚站检讨书
2015/01/29 职场文书
2015年办公室主任工作总结
2015/04/09 职场文书
2015法院个人工作总结范文
2015/05/25 职场文书
民事代理词范文
2015/05/25 职场文书
优秀班干部主要事迹材料
2015/11/04 职场文书
详解如何修改nginx的默认端口
2021/03/31 Servers
Redis数据同步之redis shake的实现方法
2022/04/21 Redis