vue2.0在android5.0白屏, es6转es5保证浏览器兼容性
1. 安装 npm install --save-dev babel-preset-es2015
2. 安装 npm install --save-dev babel-preset-stage-3
3. 在项目根目录创建一个.babelrc文件(ES6转ES5配置) 里面内容 最基本配置是:
{
// 此项指明,转码的规则
"presets": [
// env项是借助插件babel-preset-env,下面这个配置说的是babel对es6,es7,es8进行转码,并且设置amd,commonjs这样的模块化文件,不进行转码
["env", { "modules": false }],
// 下面这个是不同阶段出现的es语法,包含不同的转码插件
"stage-2"
],
// 下面这个选项是引用插件来处理代码的转换,transform-runtime用来处理全局函数和优化babel编译
"plugins": ["transform-runtime"],
// 下面指的是在生成的文件中,不产生注释
"comments": false,
// 下面这段是在特定的环境中所执行的转码规则,当环境变量是下面的test就会覆盖上面的设置
"env": {
// test 是提前设置的环境变量,如果没有设置BABEL_ENV则使用NODE_ENV,如果都没有设置默认就是development
"test": {
"presets": ["env", "stage-2"],
// instanbul是一个用来测试转码后代码的工具
"plugins": ["istanbul"]
}
}
}
然后重启npm run dev 你会发现,可以在其他低版本浏览器跑了,基本兼容所有浏览器,ie8以下除外。而且大多数的手机浏览器也ok。
IE报vuex requires a Promise polyfill in this browser问题解决
解决方法
第一步: 安装 babel-polyfill 。 babel-polyfill可以模拟ES6使用的环境,可以使用ES6的所有新方法
npm install --save babel-polyfill
第二步: 在 Webpack/Browserify/Node中使用
在webpack.config.js文件中,使用
module.exports = {
entry: {
app: ["babel-polyfill", "./src/main.js"]
}
};
替换
module.exports = {
entry: {
app: './src/main.js'
}
}
vue2.0在android5.0白屏, es6转es5保证浏览器兼容性的更多相关文章
- ipad mini2 升级9.0.2后解锁白屏解决
解锁白屏是个什么现象?就是当你用手指滑动解锁后出现输入密码的界面后,1秒之内屏幕变白,中间一个黑色的苹果,几秒之后重新回到滑动解锁的界面.我出现这个现象不是因为升级了9.0.2,而是升级了9.0.2之 ...
- Android状态栏兼容4.4.4与5.0,Android5.0状态栏由半透明设置为全透明
//判断android 版本然后设置Systembar颜色 public void initSystemBar() { Window window = getWindow(); //4.4版本及以上 ...
- <meta name="viewport"content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">的作用
本人对该标签理解不深,这里是复制了穆乙的文章:如果有人进来看到这篇文章,请按此https://www.cnblogs.com/pigtail/archive/2013/03/15/2961631.ht ...
- 前端性能优化——首屏时间&&白屏时间
1.首屏时间概念 首屏时间是指用户打开一个网站时,直到浏览器首页面内容渲染完成的时间. 2.白屏时间概念 白屏时间即是,浏览器开始显示内容的时间,所以我们一般认为解析完<head>的时刻, ...
- WebView 5.0+闪烁以及白屏问题完美解决
Android webView 在5.0+上启动硬件加速,造成部分手机出现闪烁.白屏等现象 必须写下这篇博客,遇到的问题搞了很久,百度谷歌就是没有完整的答案,记录下来,方便博友们: 需求:一个简单的W ...
- Android5.0以上版本录屏实现
我录屏的方式是分别录制音频和视频,最后合并成mp4格式,比较麻烦,因为网上完整的教程比较少,所以我打算写一个完整版的,照着我的代码写完之后,至少是能够实现功能的,而不是简单的介绍下用法. 1既然是录制 ...
- OPPO X9007 升级到Android5.0 Color2.1(root版) 详细纪实
今天要做个测试,而测试APK刚好是要求最低5.0版本,正好手里有个老款手机OPPO X9007,而预装的系统是4.3,试了下虽然也能运行,但是主要功能不正常,毕竟人家APK最低要求摆在那. 反正这个手 ...
- android5.0联系人 sort_key改成phonebook_label
项目中用到了联系人根据字母排序,在android4.0手机上是可以的,但是在android4.4以上的手机排序是乱的,一般字母排序都是根据sort_key这个拼音进行排序,而android5.0这个字 ...
- ANdroid5.0不能隐式启动service,必须显示,解决办法,加服务端包名
Intent intent = new Intent(); intent.setAction("com.viaembedded.veonvif.RemoteService");// ...
随机推荐
- UICollectionView didSelectItemAtIndexPath实现方法
didSelectItemAtIndexPath是通过UIResponder的四个touch方法实现的(touchBegan, touchMove, touchEnd, touchCancel),因此 ...
- Centos 7 安装composer和Laravel
composer安装 我安装了lnmp到Centos7里,所以可以直接运行curl -sS https://getcomposer.org/installer | php把安装的composer.ph ...
- 1506.01186-Cyclical Learning Rates for Training Neural Networks
1506.01186-Cyclical Learning Rates for Training Neural Networks 论文中提出了一种循环调整学习率来训练模型的方式. 如下图: 通过循环的线 ...
- jdk-8u181-docs.chm -- 制作时间2018年8月12日
为了方便查阅,自己做了一个JDK8的chm文件:jdk-8u181-docs.chm 密码: g675 chm制作工具 :chmwriter 目录:
- css,html备忘录
1.background:url()#000 ;代表当图片不够充满容器时,用黑色填满. 2.height:inherit;继承父级元素的高度. 当子元素给了绝对定位,父元素不给相对定位,子元素也能适配 ...
- 项目(九) 企业级Memcached服务应用实践
一, Memcached介绍 1.1 Memcached与常见同类软件对比 (1)Memcached是什么? Memcached是一个开源的,支持高性能,高并发的分布式内存缓存系统,由C语言编写, ...
- Jmeter固定定时器(Constant Timer)
如上图,Constant Timer是jmeter固定定时器元件 一般用来设置延时的,放在某个请求下,表示Constant Timer配置的指定时间后,再开始发起这个请求操作(单位:毫秒) 根据Con ...
- 深入理解C++11【2】
[深入理解C++11[2]] 1.继承构造函数. 当基类拥有多个构造函数的时候,子类不得不一一实现. C++98 可以使用 using 来使用基类的成员函数. #include < iostre ...
- EasyUIDataGrid去掉垂直滚动条
打开jquery.easyui.min.js 搜索到var _64f=wrap.width();这行代码 修改为ar _64f=wrap.width()+20;即可 另外在前台datagrid的hei ...
- java钉钉通讯录同步
钉钉做了好好几个项目了,和阿里云还有阿里钉钉合作也挺不错.因为之前就做过微信公众号,接触钉钉感觉还是比较顺手的,虽然也有一些不一样的地方. 因为之前写了一个微信公众号的开发文档,一直想写一个钉钉的开发 ...