最近在用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')]
}
希望能帮到大家,如果有错误的地方,请指出,谢谢
网友评论