使用vue-cli开发项目，在IE浏览器下打不开，显示空白问题，解决方案如下：

Vue-cli2.xx

1、安装babel-polyfill插件

npm install babel-polyfill --save-dev

2、使用babel-polyfill插件 在入口 main.js 文件引入

import 'babel-polyfill'

3、修改配置文件 修改 webpack-base-config.js 配置文件，将 entry 中的 app: './src/main.js' 配置改为：app: ['babel-polyfill', './src/main.js']

module.exports = {
entry: {
    // app: './src/main.js'
    app: ["babel-polyfill", "./src/main.js"],
  },
}

另外，如果在 index.html 中没有以下代码则添加

<meta http-equiv=X-UA-Compatible content="IE=edge">

最后重新启动项目运行即可解决。

Vue-cli3.xx

1、安装依赖包

npm install --save babel-polyfill es6-promise

2、引入依赖包 在 main.js 里边引用

import '@babel/polyfill';
import Es6Promise from 'es6-promise'
Es6Promise.polyfill()

在 babel.config.js 加上修改如下代码，没有则在根目录下新建

module.exports = {
  presets: [
    [
      "@vue/app",
      {
        "useBuiltIns": "entry",
        polyfills: [
          'es6.promise',
          'es6.symbol'
        ]
      }
    ]
  ],
};

然后重新启动项目运行，搞定，亲测有效！！！但打包之后还是不行，目前还是没有找到什么问题，有知道的大佬指点一下，非常感激。

我的解决方案

安装依赖包

npm install --save babel-polyfill

在 main.js 里边引用，注意，一定要放到最顶部

import "babel-polyfill"

在 babel.config.js 加上修改如下代码，没有则在根目录下新建

module.exports = {
   presets: [
    [
      "@vue/app",
      {
        "useBuiltIns": "entry"
      }
    ]
  ],
};

修改 vue.config.js 配置文件

module.exports = {
  chainWebpack: config => {
    config.entry.app = ['babel-polyfill', './src/main.js'];//解决白屏问题
  }
}

以上配置完成后打包环境下或线上环境下均没问题。

npm i swiper@3.4.2 --save

如果使用了 iview 需要在 vue.config.js 添加如下代码

module.exports = {
  chainWebpack: config => {
      config.module
        .rule('iview')
        .test(/iview.src.*?js$/)
        .use('babel')
          .loader('babel-loader')
          .end()
    },
}

VuePress

注意

注意：如果项目中使用 swiper 4.x 的版本，swiper 需要退回 swiper@3.4.2 的即可。