详解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 相关文章推荐
js判断两个日期是否相等的方法
Sep 10 Javascript
Jquery实现地铁线路指示灯提示牌效果的方法
Mar 02 Javascript
JavaScript图片轮播代码分享
Jul 31 Javascript
javascript实现动态标签云
Oct 16 Javascript
谈谈Jquery中的children find 的区别有哪些
Oct 19 Javascript
Vue使用vue-cli创建项目
Sep 01 Javascript
vue-cli脚手架-bulid下的配置文件
Mar 27 Javascript
AngularJS日期格式化常见操作实例分析
May 17 Javascript
JavaScript数组特性与实践应用深入详解
Dec 30 Javascript
Django+vue跨域问题解决的详细步骤
Jan 20 Javascript
vue实现的上拉加载更多数据/分页功能示例
May 25 Javascript
JavaScript箭头函数中的this详解
Jun 19 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
php使用array_rand()函数从数组中随机选择一个或多个元素
2014/04/28 PHP
PHP上传文件时自动分配路径的方法
2015/01/09 PHP
php实现的mongodb操作类实例
2015/04/03 PHP
PHP下载生成的csv文件及问题总结
2015/08/06 PHP
深入了解PHP中的Array数组和foreach
2016/11/06 PHP
文本加密解密
2006/06/23 Javascript
JavaScript 用Node.js写Shell脚本[译]
2012/09/20 Javascript
php is_numberic函数造成的SQL注入漏洞
2014/03/10 Javascript
javascript中Date对象的getDay方法使用指南
2014/12/22 Javascript
jQuery中die()方法用法实例
2015/01/19 Javascript
基于JavaScript怎么实现让歌词滚动播放
2015/11/03 Javascript
Node.js的项目构建工具Grunt的安装与配置教程
2016/05/12 Javascript
JS定时器使用,定时定点,固定时刻,循环执行详解
2016/05/31 Javascript
单击按钮发送验证码,出现倒计时的简单实例
2017/03/17 Javascript
Mint UI 基于 Vue.js 移动端组件库
2017/11/07 Javascript
详解Vue中组件传值的多重实现方式
2019/08/16 Javascript
微信小程序pinker组件使用实现自动相减日期
2020/05/07 Javascript
关于javascript中的promise的用法和注意事项(推荐)
2021/01/15 Javascript
Python读取Excel的方法实例分析
2015/07/11 Python
python中的错误处理
2016/04/10 Python
Python的面向对象编程方式学习笔记
2016/07/12 Python
Python通过future处理并发问题
2017/10/17 Python
Tensorflow 同时载入多个模型的实例讲解
2018/07/27 Python
Python数据类型之List列表实例详解
2019/05/08 Python
Python获取时间范围内日期列表和周列表的函数
2019/08/05 Python
python实现计算器功能
2019/10/31 Python
利用pandas将非数值数据转换成数值的方式
2019/12/18 Python
python获取依赖包和安装依赖包教程
2020/02/13 Python
Python替换NumPy数组中大于某个值的所有元素实例
2020/06/08 Python
如何避免常见的6种HTML5错误用法
2017/11/06 HTML / CSS
联想法国官方网站:Lenovo法国
2018/10/18 全球购物
工商管理专业应届生求职信
2013/11/04 职场文书
学习雷锋寄语大全
2014/04/11 职场文书
精彩的演讲稿开头
2014/05/08 职场文书
2014年英语教研组工作总结
2014/12/06 职场文书
教师个人年终总结
2015/02/11 职场文书