vue项目踩坑之安卓4,5,ios9页面空白

最近在用vue做项目,项目在安卓4,5,ios9页面显示空白,问题解决跟大家分享一下
安卓4,5,ios9页面空白原因:低版本不支持es6,需要将es6编译成es5

具体解决方法

1.npm install --save-dev babel-preset-es2015(安装ES2015转码规则)

2.npm install --save-dev babel-polyfill

3.npm install es6-promise

4.main.js 中引用 

import Es6Promise from 'es6-promise'

Es6Promise.polyfill()

import 'babel-polyfill'

5.修改.babelrc文件  

{
"presets": ["es2015" , "stage-2"
],
"plugins": ["transform-vue-jsx", "transform-runtime"]
}
6.webpack.base.conf.js 中修改
  对VUX进行转ES5
   {
    test: /vux.src.*?js$/,
    loader: 'babel-loader',
    query: {
    presets: ['es2015']
    },
    },
对自定义脚本进行转ES5
    {
     test: /\.js$/,
    loader: 'babel-loader',
    query: {
    presets: ['es2015']
    },
    include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
    }

希望能帮到大家,如果有错误的地方,请指出,谢谢



评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值