180  
查询码:00001103
Vue在android低版本中(5.1、4.4)报错。导致页面无法加载
作者: 朱凡 于 2019年12月25日 发布在分类 / FM组 / FM_App 下,并于 2019年12月25日 编辑

原因:低版本内置的浏览器(webview)版本太低,无法解析 ES2015最新的一些语法。需要在Webpack中配置babel-loader,还需要在项目最外层添加一个.babelrc文件用于babel默认解析ES2015中的特殊语法(例如: const,let等)

单页应用的解决方案

1、项目中安装 babel-loader

2、在package.json中”devDependencies”: {}后面添加
"babel": {
      "presets": ["env"],
      "plugins": []
}

3、在Wabpack的webpack.config.js配置文件中添加
{
     test: /\.js$/,
     exclude: /node_modules/,
    loader: "babel-loader"
}

4、 运行项目:npm run dev,或者npm run start。 

多页应用的解决方案

如果这是一个老项目,有两种解决方案

1、当前项目刚刚开始开发,没有使用过多的ES6语法,可以手动将ES6语法改写成ES5语法即可。

2、如果当前项目是一个即将上线,或者处于维护中的项目,不建议盲目的修改原有的代码,这样会导致一步错,步步错,可以自己分离出一个版本,在基础上重构,如果APP有在线更新功能,用户可以通过版本更新的方式进行替换(重构的代价比较大,请谨慎选择!)

备注:

开发前一定要做好技术选型,不可盲目选择(选择适合这个项目的方案),在选择方案的时候,要将每一个风险点及时形成记录,提交到项目经理那边,由项目经理做决定(项目经理与开发人员信息要互通)



 推荐知识

 历史版本

修改日期 修改人 备注
2019-12-25 21:47:34[当前版本] 朱凡 创建版本

  目录
    知识分享平台 -V 4.8.7 -wcp