vue打包部署后出现白屏的问题

版本支持

对于IOS 10.x无法打开的问题,加载js出错,出现白屏的情况。

具体表现:

打包后手机浏览器输入地址无法打开,Android手机浏览器及QQ等均正常打开,但是IOS手机(系统为10.X的手机,11.X以上的可以正常打开)浏览器,QQ自带浏览器,微信自带浏览器均无法打开。
网络请求没有问题,页面显示白屏

原因:

js加载时出现问题,出现错误
可能报错

1、SyntaxError: Cannot declare a const variable twice: 'e'.
(匿名函数) — vendor.05fd1a5517cb07c89e07.js:43937
t — bootstrap 22fce2de55b8522ae8a5:54
以及
2、[Error] TypeError: undefined is not an object (evaluating 'r[n].call')
    t (manifest.2ae2e69a05c33dfc65f8.js:1:410)
    NHnr (app.0cada6c24949117a7a34.js:1:774647)
    t (manifest.2ae2e69a05c33dfc65f8.js:1:415)
    webpackJsonp (manifest.2ae2e69a05c33dfc65f8.js:1:286)
    全局代码 (app.0cada6c24949117a7a34.js:1)

解决方案:

其实我们都没有错,我们也没写错,uglify也没搞错,错的是Safari本身。他们在第十七万一千零四十一号bug中承认了自己的错误:

  1. 进入build文件夹;
  2. 找到webpack.prod.conf.js文件;
  3. UglifyPlugin的定义里添加关于mangle的选项,使它变成下面这个样子:
new UglifyJsPlugin({
      uglifyOptions: {
        compress: {
          warnings: false
        },
        mangle: {
          safari10: true
        }
      },
      sourceMap: config.build.productionSourceMap,
      parallel: true
    }),
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值