android 最低兼容版本,vue cli3 es6 安卓低版本 兼容问题

问题：

1.在测试在三星 安卓7.0版本中报错，其他手机可以，低版本安卓手机出现白屏，(注释：如果静态div是正常的如图)

报错内容：

`[vue-router] Failed to resolve async component default: SyntaxError: Unexpected token ...

[vue-router] uncaught error during route navigation:

2.解决方案 ，当然是要使用bable神器啦，babel文档英文，看得也是一头雾水，在同事帮助下解决问题了，所以建议大家还是好好看babel文档。

安装依赖

npm i core-js -S

npm i @babel/plugin-transform-arrow-functions -D

npm i @babel/preset-env -D

npm i @babel/polyfill -s

在babel.config.js文件下配置(如下图)

vue.config.js 文件加上

chainWebpack: config => {

config.entry('main').add('@babel/polyfill');

},

module.exports = {

presets: [

[

'@vue/app',

{

useBuiltIns: 'usage',

corejs: '3.0.0'

}

],

[

'@babel/env',

{

useBuiltIns: 'usage',

corejs: '3.0.0',

targets: {

edge: '17',

firefox: '60',

chrome: '67',

safari: '11.1'

}

}

]

],

plugins: [

[

'import',

{

libraryName: 'vant',

libraryDirectory: 'es',

style: true

},

'vant'

],

'@babel/plugin-syntax-dynamic-import',

'@babel/plugin-transform-arrow-functions'

]

};

注释：~~~~

@babel/plugin-transform-arrow-functions 是我们要将上面的箭头函数编译，我们需要这个插件。

注意：在vue cli3 默认手脚框架也可以兼容低版本问题

presets: [

'@vue/cli-plugin-babel/preset'

],