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");// ...
随机推荐
- 常用mvn坐标
mysql-connector <dependency> <groupId>mysql</groupId> <artifactId>mysql-conn ...
- 让新版appium支持by_name定位
org.openqa.selenium.InvalidSelectorException: Locator Strategy 'name' is not supported for this sess ...
- jquery中的 parseJSON() 源码分析
parseJSON: function( data ) { // Attempt to parse using the native JSON parser first if ( window.JSO ...
- HATEOAS
HATEOAS(Hypermedia as the engine of application state)是 REST 架构风格中最复杂的约束,也是构建成熟 REST 服务的核心.它的重要性在于打破 ...
- Exp3 免杀原理与实践 20165110
Exp3 免杀原理与实践 20165110 一.. 实践内容 1.正确使用msf编码器(0.5分),msfvenom生成如jar之类的其他文件(0.5分),veil-evasion(0.5分),加壳工 ...
- HDU - 4858 项目管理
N个点,M条无向边.现在有Q组操作,一种是给 i号点增加能量,一种是询问 i号点相邻点的能量和(点间有多条边就算两次). 据说暴力能过,但还是用这题学习了一下 点分块 . 度数不超过 sqrt(M) ...
- Mac编译RocketMQ 4.1.0
参考:https://my.oschina.net/jayronwang/blog/861396 1. 前提先安装并设置好maven,jdk,git,这个网上有很多教程,就不讲了 2. 下载rocke ...
- background-attachment: fixed 在iphone设备失效的解决
下面为引用,源代码有点问题,自己修改了一下.先做记录,回头再细修. 引用部分,但代码有问题 http://www.ptbird.cn/css-background-attachment--fiexed ...
- mysql数据库优化之 如何选择合适的列建立索引
1. 在where 从句,group by 从句,order by 从句,on 从句中出现的列: 2. 索引字段越小越好: 3. 离散度大的列放到联合索引的前面:比如: select * from p ...
- systemd 编写服务管理脚本---学习
转载:https://www.cnblogs.com/sparkdev/p/8521812.html 我们运行 linux 服务器的主要目的是通过运行程序提供服务,比如 mysql.web serve ...