一、Mac电脑
- 闲鱼租用别人的Mac电脑(10块钱一天)
环境说明:
Capacitor = 8
xcode = 27.0
node = 22.23.3
react = 18
二、安装 HomeBrew
/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)"
输入数字 1(选择中科大源)
三、安装 Node22
brew install node@22
node -v
# 设置国内镜像源
npm config set registry https://registry.npmmirror.com
四、安装Xcode
App Store 安装 Xcode
xcode-select --install
# 接着接受 Xcode 许可证协议
sudo xcodebuild -license accept
# 输入开机密码,输入时密码不显示,输完直接回车
五、创建前端项目
npm create vite@latest capacitor-demo -- --template react-ts
cd capacitor-demo
# react18
npm install react@^18.3.1 react-dom@^18.3.1
# 基础依赖
npm install
# 安装 Capacitor 8 核心与 iOS 运行时
npm install @capacitor/core@^8.2.0 @capacitor/ios@^8.2.0
# 安装 Capacitor CLI(开发命令行工具)
npm install -D @capacitor/cli@^8.2.0
# 初始化 Capacitor 配置文件
npx cap init MyDemoApp com.example.mydemo --web-dir dist
六、打包、同步与 Xcode 仿真运行
6.1 基础
# 打包前端网页
npm run build
# 添加 iOS 平台(采用现代 SPM 架构)
npx cap add ios
# 同步网页资源到原生 iOS 工程
npx cap sync ios
# 检查版本环境等(若输出结果全绿无红字报错,说明环境完美配置成功)
npx cap doctor
6.2 VPN代理 (非必须,Xcode拉取不到github依赖时进行)
# 当前终端会话里设置环境变量
export all_proxy=socks5://127.0.0.1:7890
# 先进入项目根目录,然后执行下面的
cd ios/app
xcodebuild -resolvePackageDependencies -scmProvider system
文档链接: https://juejin.cn/post/7441796852955414538
后期清空all_proxy命令:
unset all_proxy
echo $all_proxy
6.3 在 Xcode 中唤起并运行 App
npx cap open ios
- 待 Xcode 自动打开项目并拉取依赖 (失败的看6.2)
- 在顶部菜单栏的设备选择下拉框中,选择一个 iOS 模拟器(例如 iPhone 17)。
- 点击左上角的 Play(运行/三角箭头) 按钮。
- 稍等片刻,虚拟 iPhone 模拟器将会弹出,你就能看到基于 React 18 + Capacitor 8 的 Demo 成功运行在模拟器中!
七、打包(Archive 归档)
7.1 前端打包
# 1. 重新打包前端静态网页
npm run build
# 2. 将网页产物同步到 iOS 原生工程
npx cap sync ios
# 3. 打开 Xcode
npx cap open ios
7.2 配置应用签名 (自动管理签名)

- 在 Xcode 左侧导航栏点击最顶部的项目根目录 App。
- 在中间区域选中 Targets 下方的 App,然后切换到顶部的 Signing & Capabilities 选项卡。
- 勾选 Automatically manage signing(自动管理签名)。
- 在 Team 下拉框中选择你的苹果开发者账号(如果没有,点击 Add an Account 登录你的 Apple ID)。
- 确认 Bundle Identifier(包名,例如 com.example.mydemo)是否符合你的预期(这个包名一旦发布到 App Store 就不能轻易修改)
备注: Xcode -> Settings -> Accounts 可以删除账号
7.3 选择归档目标设备

- 在 Xcode 顶部工具栏,点击运行按钮旁边的设备下拉菜单。
- 切记:打包时不要选模拟器,必须选择 Any iOS Device (arm64)(通用真机架构)。
7.4 开始归档

- 在顶部菜单栏点击 Product -> Archive。
- Xcode 会开始编译整个项目。编译完成后,会自动弹出一个名为 Organizer 的窗口,里面列出了你刚刚打包好的应用版本和时间戳。
八、测试
8.1 方式 A:本地真机直接调试(适合开发阶段)
- 用数据线将你的 iPhone 连接到云 Mac(如果云 Mac 是远程的,部分托管商支持 USB 映射,或者通过局域网无线调试)。
- 在 iPhone 的 设置 -> 隐私与安全性 底部开启 开发者模式 (Developer Mode)。
- 在 Xcode 顶部设备菜单中选择你的真机。
- 点击左上角的 Play(运行) 按钮,App 会直接安装并运行在你的真机上。
8.2 方式 B:通过 TestFlight 进行云端测试(最推荐,适合团队和公开测试)
- 在 Organizer 窗口中,选中刚刚归档好的版本,点击右侧的 Distribute App(分发应用)。
- 选择 TestFlight & App Store,点击 Next。
- 选项一路保持默认(让 Xcode 自动管理证书和签名上传),点击 Upload。
- 上传成功后(通常需要等待 5-10 分钟苹果服务器处理),登录 App Store Connect 官网:
- 进入你的 App 管理页面,点击 TestFlight 标签页。
- 你会看到刚刚上传的构建版本。在这里添加测试人员的邮箱(可以加你自己的 Apple ID 邮箱)。
- 测试人员在 iPhone 上下载 TestFlight App,接受邮件邀请后,就可以在线下载安装并测试你的 App 了。
九、发布App Store
9.1 创建应用 App 记录
1.登录 App Store Connect。
2.点击 我的 App (My Apps) -> 左上角 + 号 -> 新建 App。
3.填写相关信息:
平台:iOS
名称:你的 App 名称
主要语言:简体中文
Bundle ID:选择你在 Xcode 里配置的那个包名
SKU:自定义一个内部编号(例如 demo-001)
9.2 完善应用商店元数据 (Metadata)
在 App Store 后台的“App Store”标签页,需要填写或上传:
应用截图:需提供不同尺寸 iPhone 的截图(模拟器里按 Cmd + S 可以直接截图)。
应用描述与关键词:介绍你的 App 是做什么的。
隐私政策 URL:苹果现在强制要求所有 App 必须提供隐私政策网页链接。
分级信息:回答几个关于暴力、版权等内容的安全问卷,自动生成年龄分级(如 4+、12+ 等)。
9.3 提交审核
回到页面底部的 “构建版本” 区域,点击 + 号,选择你通过 TestFlight 上传并验证无误的那个版本。
填写版权信息、出口合规性证明(一般中国大陆选“否”即可,除非涉及高级加密算法)。
点击右上角的 “提交以供审核”。
提交后,通常会在 24-48 小时内收到苹果官方的审核结果。审核通过后,你就可以在 App Store 搜到并下载你的应用了!