[踩坑]vue-cli3安装@babel/polyfill后，安卓5.1等低版本页面仍然空白

白屏原因：安卓低版本无法解析es6语法,需要借助babel把es6转化为es5

安装npm install @babel/polyfill

在main.js第一行引入import '@babel/polyfill'

//vue.config.js非常重要
const path = require('path');
function resolve(dir) {
  return path.join(__dirname, dir)
}
module.exports = {
  chainWebpack: config => {
    config.module.rule('compile')
      .test(/\.js$/)
      .include
      .add(resolve('src'))
      .add(resolve('test'))
      .add(resolve('static'))
      .add(resolve('node_modules/webpack-dev-server/client'))
      .add(resolve('node_modules'))
      .end()
      .use('babel')
      .loader('babel-loader')
      .options({
        presets: [
          ['@babel/preset-env', {
            modules: false
          }]
        ]
      });
  },
}

 

//babel.config.js
module.exports = {
  presets: [
    ['@vue/app', {
      polyfills: [
        "es6.promise",
        "es6.symbol",
        "es6.array.iterator",
        "es6.object.assign"
      ],
      useBuiltIns: 'entry'
    }]
  ]
}