vue项目在安卓低版本机显示空白原因:

可能的原因一:

查看安卓debug,报错,可能有箭头函数语法错误,或者其他语法问题,那可能是ES6语法问题。

这时候需要安装babel-pollyfill。

网上找到方法如下:

https://blog.csdn.net/anxin_wang/article/details/78873359

1.安装babel-polyfill和es6-promise

npm i babel-polyfill --save
npm i es6-promise --save
2.main.js引入 import ‘babel-polyfill‘
import Es6Promise from ‘es6-promise‘
Es6Promise.polyfill()
3.webpack.base.conf.js module.exports = {
entry: {
  "babel-polyfill":"babel-polyfill",
   app: ‘./src/main.js‘ //原本只有这一行
}

这时如果安卓机依然空白打不开,继续查看原因二

可能的原因二:

查看npm run build打包之后有没有打包报错,有时间一些小功能可能不影响页面展示和使用,但是打包也报错了,我们可能就忽略了,只要打包有报错,安卓就一定不能正常显示,不像浏览器,我这里看到的报错是

发现报错的位置是在router文件夹下的index.js文件中   分别是用了es6对象的合并,和模版字符串,这时候只需要去webpack.base.conf.js中

{
test: /\.js$/,
loader: 'babel-loader',
include: [
resolve('src'),//表示在src目录下的js需要编译
],
},

加一个include,resolve  router所在目录即可,如果这里直接写路径,会不起作用。

vue项目在安卓低版本机显示空白原因的更多相关文章

  1. 如何解决vux不兼容安卓低版本问题

    最近做移动端H5页面用VUX来写UI组件这块.ios测试的时候没啥大问题,不过在4.4版本的华为手机上测试就崩了.接下来详细记述下崩的几个点. 第一:vux自带的提示框,在低版本安卓系统上全不是居中显 ...

  2. 高版本的jdk编译过的项目移到低版本的JDK的eclipse中出错的问题

    由于2台电脑安装的jdk版本不一样,导致从一台电脑移动项目到另一台电脑上时,运行出现了错误,错误信息如下: 主要是原先项目运行的JDK版本为1.8, 而要移过去的电脑的jdk是1.7的,首先已经把bu ...

  3. 当在安卓低版本呈现的界面(H5)出现问题的时候,我们怎么解决?

    昨天,在医院现场的客服人员,向我们反馈一个问题:说一位用户用他的安卓手机打开我们的app之后,界面是乱掉的:如下图: 向客服询问了具体的设备信息:安卓系统版本号是4.2 下意识觉得是因为css的兼容问 ...

  4. 火狐低版本中显示时间格式为:yyyy-MM-dd hh:mm:ss,出现NaN

    在低版本的火狐(43以下)和IE8中,显示时间格式为:yyyy-MM-dd hh:mm:ss,会出现NaN:原因是只支持yyyy/MM/dd hh:mm:ss; 所以在new Date('2018-0 ...

  5. axios 安卓低版本兼容性处理

    问题: 在较低版本的android手机中发现封装的 http 无效,我测试使用的是android 4.4的老手机,主要就是无法使用promise. 解决方案 安装 npm install es6-pr ...

  6. vue项目未加载完成前显示loading...

    1.在Index.html里面加入loading的元素,让loading元素显示,让app元素隐藏 <!DOCTYPE html> <html> <head> &l ...

  7. vue项目中 favicon.ico不能正确显示的问题

    方法一:修改index.html文件 <link rel="shortcut icon" type="image/x-icon" href="f ...

  8. vue项目 多文件上传并显示在页面上

    <template> <label for="file" class=" btn btn-default" style="borde ...

  9. Vue项目之IE下打开页面是空白

    原因是:Babel 默认只转换新的 JavaScript 句法(syntax),而不转换新的 API ,比如 Iterator.Generator.Set.Maps.Proxy.Reflect.Sym ...

随机推荐

  1. PHP+Mysql学习笔记

    1.      PHP is Hypertext Preproocessor. 2.      Hello World: <?php Echo 'Hello World!'; ?> 3.  ...

  2. php 抽象类 静态 单体设计模式

    php oop----抽象类 抽象类机制使得子类可共用基类的某些信息,具体细节会留给子类,典型用在这样情形中,抽象类并不定义全部的方法,部分方法的实现推迟到子类继承抽象类时.它是介于接口和具体类间的一 ...

  3. js获取判断苹果手机机型

    原先获取不了苹果系列的型号,但转换思路,先判断是否是苹果,再用分辨率获取型号 //获取手机型号函数beginfunction getPhoneType(){ //正则,忽略大小写var pattern ...

  4. ES-常见搜索方式

    1.query string search 2.query DSL 3.query filter 4.full-text search 5.phrase search 6.highlight sear ...

  5. 【Spark】榨干Spark性能-driver、exector内存突破256M

    榨干Spark性能-driver.exector内存突破256M spark driver memory 256m_百度搜索 Spark executor.memory - CSDN博客 sparkd ...

  6. ELK菜鸟手记 (一) 环境配置+log4j日志记录

    1. 背景介绍 在大数据时代,日志记录和管理变得尤为重要. 以往的文件记录日志的形式,既查询起来又不方便,又造成日志在服务器上分散存储,管理起来相当麻烦, 想根据一个关键字查询日志中某个关键信息相当困 ...

  7. .NET Core修改监听端口

    把Program.cs加一行UseUrls代码如下: using System.IO; using Microsoft.AspNetCore.Hosting; using Microsoft.AspN ...

  8. CentOS7中ELK6.2.3安装

      一.配置主机名 hostnamectl set-hostname elk vim /etc/sysconfig/network修改HOSTNAME=elk 安装Java环境:yum install ...

  9. Oracle只读用户角色的建立

    授予某模式下对象读权限给角色,就可以建立Oracle只读用户角色,下文对该方法的实现步骤作了详细的介绍,供您参考学习. 下面为您介绍的是Oracle只读用户角色的建立方法,该方法供您参考,如果您在Or ...

  10. mock以及特殊场景下对mock数据的处理

    一.为什么要mock 工作中遇到以下问题,我们可以使用mock解决: 无法控制第三方系统某接口的返回,返回的数据不满足要求 某依赖系统还未开发完成,就需要对被测系统进行测试 有些系统不支持重复请求,或 ...