vue项目中部分android手机加载打包后的index页面显示空白的问题:uncaught syntaxerror:block-scoped declarations...

记录遇到的问题:
在vue项目中遇到加载打包后的index页面,部分android手机会出现空白页面的问题,并且报

Block-scoped declarations (let, const, function, class) not yet supported outside strict mode

的错误,在不报此错误的其他android手机上则没有此空白页面的问题。

尝试一下把原本写在index.html文件的逻辑,放到main.js里面(main.js是vue的入口问文件,虽然不知道为什么有的android手机可以执行index.html内的操作,有的不可以),
onload事件用

to.path === from.path && to.path === '/'

这个判断是第一次加载要执行的操作,路由的跳转用:

next({
	  path: '/xxx',
	  redirect: '/xxx'
})
注:xxx为页面,redirect是改变根路由。

以上可能会解决部分低版本的android手机,如果没有解决就尝试下面的办法。

提示的错误信息就是在严格模式下不支持这种声明,网上搜索原因,说是webpack-dev-server版本高于2.7.1时,在打包编译时不会把es6转es5,所以系统版本较低时会出错,查找git上创建此项目时的配置,发现package.json中原本就是2.9.1,

 "webpack": "^3.6.0",
 "webpack-bundle-analyzer": "^2.9.0",
 "webpack-dev-server": "^2.9.1",
 "webpack-merge": "^4.1.0"

此项目在之前的打包中也没有遇到这个问题,应该不用非要把webpack-dev-server进行降级,对比此前唯一改变的情况就是我的node版本,于是重新下载项目,用nvm切换到旧的node版本,重新运行并打包,经过测试后,则解决了这个问题。
在此记录下此次问题的解决方法。
注:重点在切换到旧版的node版本上,node版本的不匹配问题。

PS:如果手机版本再过低,那就放弃吧。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值