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:如果手机版本再过低,那就放弃吧。

你可能感兴趣的:(vue学习笔记,环境配置)