uniapp iOS离线打包——原生工程配置

本文详细介绍了如何在HBuilderX中配置uniapp的iOS离线打包项目,包括Xcode版本、Appkey设置、应用图标替换、第三方SDK导入,以及处理未配置模块和懒人导入库文件的方法。

uniapp iOS离线打包,如何配置项目工程?


App iOS 离线打包


前提:

  • 安装 Xcode 14 及以上版本
  • HBuilderX下载
  • App离线SDK下载:最新iOS平台SDK下载
  • 确保版本一致,请确保从 HBuilderX 导出的打包资源的HBuilderX的版本号和App离线SDK发布的版本号是一致的,【即 HBuilderX 开发工具版本 要与 SDK 版本一致】
  • 具体详情可以看官方文档

工程配置效果图

  • 根据个人所需,配置相关环境,是自动生成证书,还是导入已生成证书。
    在这里插入图片描述

Debug

在这里插入图片描述


Release

在这里插入图片描述


配置工程

  • 找到App离线SDK压缩包,并解压,再进入目录;找到HBuilder-Hello文件夹,并打开原生工程,然后准备配置工程。
  • 接下来,根据文档提示把相关的 Bundle IdAppkey应用名称版本名称应用图标启动图 等进行配置。
  • 至于国际化,根据项目需求进行配置
  • 这里举例下,如何配置 Appkey

配置 Appkey

  • 首先,要登录 开发者中心

  • 在应用管理 - 我的应用 - 各平台信息 创建以及查看离线 AppKey

    在这里插入图片描述


  • 创建成功后,找到 dcloud_appkey 把 key 复制进去即可

    在这里插入图片描述


  • 同时,在 control.xml 中把 appid 修改为,当前申请离线 keyappid

在这里插入图片描述


应用图标

  • 我使用比较笨的一种方式,就是把示例工程的 相关图标,进行替换。 前提是,要准备好应用相关尺寸图标。

在这里插入图片描述


在这里插入图片描述


模块及三方SDK配置

iOS模块配置


未配置模块错误
  • 因 开发项目 涉及 蓝牙通讯 功能,所以需要导入 库文件,否则打包后,会弹窗提示。

    在这里插入图片描述


配置模块
  • 在离线SDK包里,SDK/Resources/Libs 目录下找到需要的库文件,然后把找到的 liblibBlueTooth.a 库拷贝到工程的 libs 目录下,再根据配置要求把相关的库引入到工程中

在这里插入图片描述


  • 选择 库文件
    在这里插入图片描述

在这里插入图片描述

  • 打包后,应用也不报错啦~
TIP:
  • 懒人方法:还可以这样导入库文件,就是把 SDK工程配置 同级,选择 库文件 时,直接选择 SDK 下的,这样也不用,提前把库文件,拷贝到项目工程下。
  • 缺点:就是他们是依赖关系,如果项目路径移动时,无法使用的。

在这里插入图片描述


** 至此, 如果项目不报错,简单工程配置成功了,因为官方表达比较清楚,我这里就不在一一说明,接下来分享打包这块的流程。

### UniApp 打包 App 出现白屏的原因分析 在 UniApp 开发过程中,打包后的应用可能会因为多种原因导致白屏现象。以下是常见的错误原因及其对应的解决方案: #### 1. **地图插件调用问题** 当使用 `uni.openLocation` 调用高德地图或其他地图服务时,在某些情况下会出现地图白屏的现象。这通常是因为未正确配置地图 SDK 或者缺少必要的权限设置。 - 原因:可能是由于 Android 和 iOS 平台上的权限管理不同步或者 API 配置有误引起的。 - 解决方案:确保已按照官方文档完成相关依赖库的引入以及权限声明[^1]。例如: - 在 AndroidManifest.xml 中添加网络访问权限: ```xml <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/> <uses-permission android:name="android.permission.INTERNET"/> ``` - 对于 iOS 设备,需确认 Info.plist 文件中的隐私权限是否齐全。 #### 2. **ECharts 移动端适配问题** 如果项目中集成了 ECharts 图表组件,则可能出现移动端渲染失败的情况,表现为页面加载完成后呈现一片空白区域。 - 原因:移动设备缺乏 DOM 结构支持,直接嵌入 HTML Canvas 可能引发冲突。 - 解决方法之一是通过 canvas-to-dataurl 技术实现离线绘制功能[^2];另一种可行的办法是在初始化图表前动态创建容器节点并绑定至视图层。 ```javascript // 动态生成 dom 容器实例化 echarts 实例 let chartDom = document.createElement('div'); chartDom.style.width = '100%'; chartDom.style.height = '400px'; document.body.appendChild(chartDom); const myChart = echarts.init(chartDom); myChart.setOption({ title: { text: '示例折线图' }, tooltip: {}, xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed'] }, yAxis: {type: 'value'}, series: [{ data: [820, 932, 901], type: 'line' }] }); ``` #### 3. **H5 支付兼容性问题** 对于自定义 H5 微信支付流程的应用程序来说,iOS 用户反馈较多的是退出支付界面回到原生 APP 后发生黑屏状况。 - 成因推测:主要是 Safari 浏览器行为差异所致——即关闭 webview 导致上下文丢失从而影响后续逻辑执行流正常恢复[^3]。 - 应对策略建议如下所示: * 使用 JavaScriptBridge 提供跨平台通信机制来捕获事件回调; * 如果条件允许的话可以考虑切换成 Native Payment Gateway 来规避此类风险。 综上所述,针对上述三种典型场景下的具体表现形式给出了针对性较强的修复措施。开发者应仔细排查各自项目的实际情况再做调整优化处理。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值