详解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 相关文章推荐
img onload事件绑定各浏览器均可执行
Dec 19 Javascript
Javascript实现页面跳转的几种方式分享
Oct 26 Javascript
JS实现新浪微博效果带遮罩层的弹出框代码
Oct 12 Javascript
JavaScript的React框架中的JSX语法学习入门教程
Mar 05 Javascript
jquery代码规范让代码越来越好看
Feb 03 Javascript
JavaScript中闭包的详解
Apr 01 Javascript
JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理)
Jun 09 jQuery
微信小程序实现选项卡功能
Jun 19 Javascript
Vue.js devtool插件安装后无法使用的解决办法
Nov 27 Javascript
vue中datepicker的使用教程实例代码详解
Jul 08 Javascript
layer父页获取弹出层输入框里面的值方法
Sep 02 Javascript
如何通过简单的代码描述Angular父组件、子组件传值
Apr 07 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
DC漫画《蝙蝠侠和猫女》图透 猫女怀孕老爷当爹
2020/04/09 欧美动漫
php实现的DateDiff和DateAdd时间函数代码分享
2014/08/16 PHP
PHP实现扎金花游戏之大小比赛的方法
2015/03/10 PHP
PHP+jQuery翻板抽奖功能实现
2015/10/19 PHP
php htmlentities()函数的定义和用法
2016/05/13 PHP
ThinkPHP使用Ueditor的方法详解
2016/05/20 PHP
PHP基于自定义类随机生成姓名的方法示例
2017/08/05 PHP
Laravel 数据库加密及数据库表前缀配置方法
2019/10/10 PHP
使Ext的Template可以解析二层的json数据的方法
2007/12/22 Javascript
使用非html5实现js板连连看游戏示例代码
2013/09/22 Javascript
jquery+json实现数据列表分页示例代码
2013/11/15 Javascript
js完美的div拖拽实例代码
2014/01/22 Javascript
自己动手手写jQuery插件总结
2015/01/20 Javascript
jQuery中serializeArray()与serialize()的区别实例分析
2015/12/09 Javascript
jQuery的ready方法实现原理分析
2016/10/26 Javascript
Radio 单选JS动态添加的选项onchange事件无效的解决方法
2016/12/12 Javascript
ES6(ECMAScript 6)新特性之模板字符串用法分析
2017/04/01 Javascript
JavaScrpt中如何使用 cookie 设置查看与删除功能
2017/07/09 Javascript
vue 中filter的多种用法
2018/04/26 Javascript
浅谈element中InfiniteScroll按需引入的一点注意事项
2020/06/05 Javascript
Python实现将16进制字符串转化为ascii字符的方法分析
2017/07/21 Python
Python正则表达式非贪婪、多行匹配功能示例
2017/08/08 Python
Python双向循环链表实现方法分析
2018/07/30 Python
python多进程控制学习小结
2018/10/31 Python
python读取raw binary图片并提取统计信息的实例
2020/01/09 Python
Python2.6版本pip安装步骤解析
2020/08/17 Python
美国波道夫·古德曼百货官网:Bergdorf Goodman
2017/11/07 全球购物
香港百佳网上超级市场:PARKNSHOP.com
2020/06/10 全球购物
java程序员面试交流
2012/11/29 面试题
服务标兵事迹材料
2014/05/04 职场文书
小学生勤俭节约倡议书
2015/04/29 职场文书
新郎父亲婚礼致辞
2015/07/27 职场文书
导游词之湖北梁子湖
2019/11/07 职场文书
MySQL删除和插入数据很慢的问题解决
2021/06/03 MySQL
浅谈Go语言多态的实现与interface使用
2021/06/16 Golang
iOS 16进一步确认,一共支持16款iPhone
2022/04/28 数码科技