美文网首页H5开发移动端APPWEB前端学习
MUI、HBuilderX、H5+开发APP本地打包(iOS)

MUI、HBuilderX、H5+开发APP本地打包(iOS)

作者: Light413 | 来源:发表于2020-04-01 22:39 被阅读0次

此文基于MUI、HBuilderX、H5+开发的APP本地打包,不适用uniapp。

同款Android的在这里: MUI、HBuilderX开发APP本地打包(Android篇)

iOS的离线打包感觉比Android的更简单点,或许是因为我本身做iOS原生开发的缘故。但当我看了官方提供的文档仍然摸索了一段时间,对于不是熟悉iOS开发的估计更加迷惑,所以按照我打包的操作步骤记录成文。以便下次回顾,还有以前写了Android离线打包,没有iOS的总感觉不完美。

不管是离线的还是官方所谓的在线云打包,其实都是一样的操作,不过我们的是手动一步步去操作,官方在线的直接跑脚本自动执行。所以不要认为云打包多神奇,它只是苹果开发原生操作上套了一层外衣,但对于一般情况来说它确实方便很多。

准备

  • Mac电脑或具备macOS环境的其他电脑
  • HBuilderX : 2.5.1.20200103
  • iOS SDK : iOSSDK@2.5.1.72774_20200103
  • Xcode : Version 11.1 (11A1027)
  • 苹果开发者账号(299的企业账号、99个人开发者账号、或针对学校教育的账号)

开始

1、首先HBuilderX导出项目的本地打包APP资源。

1.APP资源文件.png
com.light.dctt就是appid

2、下载 sdk iOSSDK@2.5.1.72774_20200103 包含SDK及示例相关。

1.目录结构.png

3、HBuilder-Hello 为打包官方示例,此示例一个全功能的demo,包含各种功能所需的动态库、框架及第三方sdk所以文件比较大。

因为重新建工程要引入的资源、动态库文件太多,有点繁琐。所以直接在这里操作,去掉不需要的部分,添加我们自己的东西。

4、打开工程:修改工程名,项目名等,总之把Hello-HBuilder改为我们自己的项目名;

2.HBuilder-Hello工程目录结构2.png
  • 修改项目名 , 把下面红框的改为项目名dctt
3名称.png

修改完工程名,一些文件路径肯定也变了,必须对应的修改否则编译提示找不到指定路径的文件。

3.编译路径.png
  • 修改名称、路径之后先运行下,确保不会出错。


    3.修改工程名称完成.png

OK,是原来的效果,说明我们名称路径之类的操作修改没问题。

5、 替换我们的项目代码

原来的代码:

4.替换项目源码.png

替换后我们的代码:

4.替换源码后.png

6、修改工程中appid

5.修改appid.png 5.修改appid2.png

其中 com.light.dctt就是appid , 文件层级必须严格一致。否则不能行。

7、以上修改完成,模拟器运行一下看效果

4.运行效果.png

OK,虽然页面适配有点问题,但说明我们一切操作还正常。

修改APPicon 和启动页图片

xcode 图片资源管理都是在Images.xcassets中处理的,替换相应的尺寸图片即可,不需要的可以直接删除。

ios实际开发时其他所需的icon资源也是放这里,不过对于目前项目来说没啥用!

6.修改APP icon.png 6.启动图.png

plist文件配置相关

dctt-Info.plist相关的配置信息及权限设置都在这里。相当于Android的 AndroidManifest.xml , 也是一个XML格式的文件。

用到的系统的权限不在这里设置的话,APP内无法启用相关功能。

权限及配置.png

删除不需要的链接库及第三方sdk

源工程包含的全套面了,定位、支付、推送、蓝牙、通讯录一大堆的功能都有,所以打出包很大,把我们不需要的统统删了吧!

删除不需要的链接库.png

app正式打包发布

  • 1、设置证书

我有开发者账号,我要发布,我要打包!
没有账号,这项操作不就可以了。

我的是企业开发者账号,就是它299$ 而且APP打包后不能上App Store的那个。打包后的APP可放自己网站发布,不受苹果限制。这不影响我们示范打包操作。

走到这一步,和原生开发的都一样了,别人怎么样我们就得怎么样,我们必须要有个发布描述文件:


image.png

在开发者中心注册该APPID,然后生成证书和发布文件。

如果你不熟悉苹果开发,这个证书的问题估计不好搞定。如果你熟悉苹果开发,这里和容易搞定。所以在此不宜多说。

7.设置证书.png
  • 2、打包操作
8.打包.png 8.打包成功.png 9.导出ipa.png

这里导出IPA , 我是企业证书所以和普通的不一样,选择第三个 。如果是99$的账号 选择第一个 导出 App Store发布。

9.thing默认不瘦身.png 10.导出ipa2.png

至此打包完成,可以把发布IPA直接导入到苹果设备或放网上发布供别人下载。

总结

  • 修改文件名注意文件路径,编译路径要保持一致。 APPID 必须和manifest.json 保持一致。

  • 以上只是基础的打包流程操作,如果涉及第三方平台调用之类的还要仔细查看相关文档。 logo.png
  • 此文图文较多、步骤详细。按步骤操作打包肯定没问题。但对于APP本身开发优化无济于事。

参考

iOS离线打包:(https://ask.dcloud.net.cn/article/41)

我的博客即将同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=fjnklqkwq3pl

相关文章

网友评论

    本文标题:MUI、HBuilderX、H5+开发APP本地打包(iOS)

    本文链接:https://www.haomeiwen.com/subject/fuhwuhtx.html