详解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 相关文章推荐
jquery 1.3.2 IE8中的一点点的小问题解决方法
Jul 10 Javascript
微博@符号的用户名提示效果。(想@到谁?)
Nov 05 Javascript
利用js的Node遍历找到repeater的一个字段实例介绍
Apr 25 Javascript
Javascript与jQuery方法的隐藏与显示
Jan 19 Javascript
javascript字符串循环匹配实例分析
Jul 17 Javascript
Vue.js搭建移动端购物车界面
Jun 28 Javascript
vue使用axios时关于this的指向问题详解
Dec 22 Javascript
新手快速入门JavaScript装饰者模式与AOP
Jun 24 Javascript
JS常用排序方法实例代码解析
Mar 03 Javascript
基于vue项目设置resolves.alias: '@'路径并适配webstorm
Dec 02 Vue.js
vue+element table表格实现动态列筛选的示例代码
Jan 14 Vue.js
详解JavaScript中的执行上下文及调用堆栈
Apr 29 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 stream_context_create()作用和用法分析
2011/03/29 PHP
PHP 提取图片img标记中的任意属性的简单实例
2013/12/10 PHP
php实现递归与无限分类的方法
2015/02/16 PHP
php对二维数组进行相关操作(排序、转换、去空白等)
2015/11/04 PHP
Yii2中Restful API原理实例分析
2016/07/25 PHP
Zend Framework入门教程之Zend_Mail用法示例
2016/12/08 PHP
PHP程序员必须知道的两种日志实例分析
2020/05/14 PHP
过虑特殊字符输入的js代码
2010/08/05 Javascript
jQuery中clone()方法用法实例
2015/01/16 Javascript
js实现时间显示几天前、几小时前或者几分钟前的方法集锦
2015/05/29 Javascript
javascript 常见功能汇总
2015/06/11 Javascript
js中flexible.js实现淘宝弹性布局方案
2020/06/23 Javascript
在线引用最新jquery文件的实现方法
2016/08/26 Javascript
详解Vue.js分发之作用域槽
2017/06/13 Javascript
自适应布局meta标签中viewport、content、width、initial-scale、minimum-scale、maximum-scale总结
2017/08/18 Javascript
使用JavaScript中的lodash编写双色球效果
2018/06/24 Javascript
react native 获取地理位置的方法示例
2018/08/28 Javascript
js实现按钮开关单机下拉菜单效果
2018/11/22 Javascript
vue+element 模态框表格形式的可编辑表单实现
2019/06/07 Javascript
解决vue+webpack项目接口跨域出现的问题
2020/08/10 Javascript
[47:03]完美世界DOTA2联赛PWL S3 access vs LBZS 第一场 12.20
2020/12/23 DOTA
python网络编程实例简析
2014/09/26 Python
python 获取一个值在某个区间的指定倍数的值方法
2018/11/12 Python
python requests包的request()函数中的参数-params和data的区别介绍
2020/05/05 Python
美国第二大连锁药店:Rite Aid
2019/04/03 全球购物
解释一下抽象方法和抽象类
2016/08/27 面试题
Linux文件操作命令都有哪些
2016/07/23 面试题
财务专业大学生职业生涯规划范文
2013/12/30 职场文书
道路建设实施方案
2014/03/18 职场文书
电视购物广告词
2014/03/19 职场文书
团干部培训方案
2014/06/03 职场文书
商业计算机应用专业自荐书
2014/06/09 职场文书
西安兵马俑导游词
2015/02/02 职场文书
青年人初次创业的“五不要”
2019/08/23 职场文书
高端收音机+蓝牙音箱,JBL TUNER FM带收音蓝牙音箱评测
2021/04/24 无线电
java基础——多线程
2021/07/03 Java/Android