网站建设与管理专业是什么,做网站的热门行业,东莞网站推广优化网站,网站开发服务费一、前言
问题描述#xff1a;基于 taro 框架的 H5#xff0c;本地构建或者发到服务器后#xff0c;安卓手机在支付宝APP中打开链接呈现白屏的情况#xff0c;但是在其他浏览器或者微信中打开正常#xff1b;问题根源#xff1a;由于支付宝的 webview 浏览器内核不支持 …一、前言
问题描述基于 taro 框架的 H5本地构建或者发到服务器后安卓手机在支付宝APP中打开链接呈现白屏的情况但是在其他浏览器或者微信中打开正常问题根源由于支付宝的 webview 浏览器内核不支持 es6 高级 js 语法导致页面解析出错加载页面异常问题解决在项目打包构建的时候利用 babel 将 es6 转成 es5 即可。
二、解决步骤
1. 添加 Babel
yarn add babel/preset-env2. 添加版本限制可不添加最好添加一下
// babel.config.js
// 添加以下配置内容
// targets: {
// ios: 9,
// android: 5
// }
module.exports {presets: [[taro,{framework: react,ts: true,targets: {ios: 9,android: 5}}]],plugins: [...]
};3. 添加 babel-loader 调用 babel进行 es6 转 es5 操作
// config/index.js
const config {...h5: {...webpackChain(chain, webpack) {chain.merge({module: {rule: {loader: {test: /\.js$/,use: [{loader: babel-loader,options: {}}]}}}});}},...
};三、拓展补充
对于 ios9 和 android5 以下的版本目前大部分情况下开发已不进行考虑兼容 Android 5及以下版本存在一些已知的问题和限制包括但不限于 安全性问题随着Android版本的更新Google不断增强了系统的安全性。Android 5及以下版本可能缺乏最新的安全补丁和防护措施。性能问题新的Android版本通常会包含性能优化和改进而旧版本可能无法享受到这些优化。兼容性问题许多新的应用和库可能不再支持Android 5及以下版本。用户体验新的Android版本通常会带来更好的用户体验包括新的用户界面和功能。API限制Android 5及以下版本的API级别较低无法使用一些新的API和功能。 开发者可能会限制对iOS 9及以下版本的支持主要原因包括 兼容性问题随着iOS版本的更新Apple引入了许多新的API和功能。这些新的API和功能可能无法在iOS 9及以下版本上使用。安全性问题新的iOS版本通常包含最新的安全补丁和防护措施。iOS 9及以下版本可能缺乏这些安全更新。性能问题新的iOS版本可能包含性能优化和改进而iOS 9及以下版本可能无法享受到这些优化。维护成本支持旧版本的iOS可能会增加开发和测试的复杂性和成本。例如开发者可能需要编写额外的代码来处理旧版本的iOS的特殊情况或者需要在多个版本的iOS上进行测试。用户基数随着时间的推移使用iOS 9及以下版本的用户可能会越来越少。因此开发者可能会选择只支持更新的版本以便能够专注于为大多数用户提供最好的体验。
