ios10vue白屏

朋友，你是否遇到过ios10打开vue项目，无论是苹果内置浏览器，还是微信浏览器，都白屏，所有页面统统白屏的苦恼。不要怕，这是因为我们的一些es6语法，在ios10上支持不佳导致的。以下提供一下我试过的两种方法，建议都采用，都保留。

以下方法仅是在山穷水尽，确认代码确实没有问题的时候使用，我就是在ios10用户访问一个只有图片的页面仍然白屏的时候才使用的下列方法解决的问题。

---

—————— 分割线 ————————
2020年1月9日
忘记更新博客了，其实是我引入了一个第三方包，这个包在node_modules里根本没有编译成es5语法，尝试了各种黑科技都无果，没办法我只能换包，换一个支持es5语法的npm包，目前还没收到用户反馈，我感觉应该是管用的。
—————— 分割线 ————————

---

法一

1. 下载安装babel-polyfill插件

npm i babel-polyfill --save-dev

或者

cnpm i babel-polyfill --save-dev # 淘宝源，国内访问速度杠杠的

2. 修改webpack

在 webpack.base.conf.js 文件内：

const webpackConfig = {
	// ......
    entry: {
        // app: './src/main.js'  // 原有配置，注释掉
        app: ['babel-polyfill', './src/main.js']  // HACK: 使用babel-polyfill插件解决ios10白屏问题
    }
    // ......
}

我是使用了法一就可以加载页面了，所以先写在前面，你也可以试试法二。

法二

1. 修改webpack

在webpack.prod.conf.js中：

new UglifyJsPlugin({
    uglifyOptions: {
        compress: {
            warnings: false
        },
        // HACK: 解决ios10白屏问题，试了一下没有效果，但是为了避免出现此类情况，这里仍设置为true
        mangle: {
            safari10: true
        }
    },
    sourceMap: config.build.productionSourceMap,
    parallel: true
}),