Capacitor CLI: 项目设置指南

想用一个代码库来构建iOS和Android应用程序吗? Capacitor CLI 简化了流程，让您使用 web 技术创建原生应用。您将学习以下内容：

快速设置: 安装 Capacitor CLI 并在几分钟内初始化您的项目。
平台集成: 使用简单的命令添加 iOS 和 Android 支持。
实时更新: 使用 __CAPGO_KEEP_0__ 进行即时的无线更新。 Capgo : troubleshoot sync 错误或构建失败等问题。
开始的关键步骤：__CAPGO_KEEP_0__

__CAPGO_KEEP_1__

安装 Node.js, npm, JDK, Xcode, 和 Android Studio.
运行 npm install @capacitor/core @capacitor/cli 并初始化您的项目。
使用 npx cap add ios 和 npx cap add android.
可选：设置Capgo用于实时应用程序更新.

This guide covers everything you need to set up Capacitor CLI, configure platforms, and deploy your app. Let’s dive in!

介绍 Capacitor __CAPGO_KEEP_0__ 框架文档网站

Capacitor Framework Documentation Website

开始之前，请确保已安装以下工具:

Node.js

(版本 14 或更新版本) 和 __CAPGO_KEEP_0__ npm
__CAPGO_KEEP_1__ (版本 11 或更新)
Xcode (版本 12 或更新，仅限 iOS 构建)
Android Studio (仅限 Android 构建)
Capacitor CLI (版本 6 或 7)

可选： 如果您想启用实时更新，请参阅下面的“Capgo Capgo 配置指南”。

CLI Capgo 安装步骤

在开始之前，请确保您已经 Node.js, npm, JDK, Xcode，和 Android Studio set up. Once ready, you can install the Capacitor CLI by running:

npm install --save @capacitor/core @capacitor/cli
npx cap init

该命令安装Capacitor并设置其核心组件。

完成此步骤后，请转到 创建新项目 来为您的应用程序搭建基础结构。

创建一个新项目

开始使用您的项目使用 Capacitor CLI按照以下步骤进行：

mkdir my-app && cd my-app
npm init -y
npx cap init my-app com.company.app --web-dir dist

更新配置文件

编辑 capacitor.config.json 文件，包含以下设置：

{
  "appId": "com.company.app",
  "appName": "My App",
  "webDir": "dist",
  "bundledWebRuntime": false,
  "server": {
    "hostname": "app.example.com",
    "androidScheme": "https"
  }
}

更新后，请使用此配置文件为您的项目设置 Capacitor

平台设置

现在项目骨架已经完成，是时候设置iOS和Android目标了

添加iOS和Android

首先使用 Capacitor CLI 安装必要的平台特定包

npm install @capacitor/ios @capacitor/android
npx cap add ios
npx cap add android

确保 iOS 设备上安装了 Xcode 14 或更高版本、CocoaPods 1.11 或更新版本，以及 macOS 12 或更高版本。对于 Android 设备，您需要 Android Studio Giraffe (2022.3.1+)、JDK 17 或更高版本，以及 Gradle 7.5 或更高版本。 CocoaPods 1.11 或更新版本安装后，您需要将本地目标更新为与您的 Web 应用程序的更改保持同步。平台更新

同步您的平台以获取最新的 Web 更改，请按照以下步骤更新您的 Web 应用程序后：

该命令处理两个任务：

将更新的 Web 资产复制到本机平台

npm run build
npx cap sync

更新本机配置和插件以匹配最新的更改 cap sync 将更新的 Web 资产复制到本机平台

更新本机配置和插件以匹配最新的更改
将更新的 Web 资产复制到本机平台

IDE 配置

打开适当的 IDE 来查看平台特定的项目:

npx cap open ios     # Opens Xcode
npx cap open android # Opens Android Studio

在 Xcode 中:

选择您的开发团队。
设置签名证书。
更新您的包标识符。

在 Android Studio 中:

修改应用程序 ID 在 build.gradle.
配置用于签名的.keystore 文件。
设置 debug 和 release 构建变体。

当所有配置完成后，使用 npx cap build ios 或 npx cap build android. 请确保所有资产都是最新的， npx cap sync 再次运行

Capgo 快速上手指南

Capgo 实时更新控制台界面

设置 Capgo 以便在应用程序中启用即时的线上更新。

Capgo 的关键功能

Capgo 提供了多种工具来简化应用程序更新：

端到端加密 确保更新的安全传递。
更新 在后台运行 应用启动时。
分析工具 帮助跟踪更新成功率和用户参与度。
A 一个点击回滚 选项让您快速恢复从有问题的更新。
使用 渠道系统 进行分阶段发布和测试。

安装 Capgo

按照以下步骤开始使用 Capgo:

安装 Capgo CLI:
```
npm install --save @capgo/cli
```
初始化 Capgo 在您的项目中:
```
npx capgo init
```
构建和发布更新:
```
npm run build
npx capgo release
```
打开应用程序以触发后台更新过程。

最佳实践

使用渠道测试更新之前将其发布给所有用户。
监控分析以确保更新成功并且用户保持活跃。
启用错误跟踪以及早捕获和修复问题。
保持回滚功能以快速解决任何问题。

Capgo 与 Capacitor 8 兼容，集成 CI/CD pipeline 流程，符合 Apple 和 Google 商店要求。

常见问题和提示

完成平台和 Capgo 设置后，您可能会遇到一些常见错误。以下是快速解决它们的方法。

环境设置问题

CLI 未找到 错误: 命令 npx cap 执行失败。修复: 运行 npm install --save @capacitor/cli @capacitor/core 并再次尝试。
Node.js 版本不符 错误: CLI 命令因 Node.js 版本错误而失败。修复: 安装 Node.js 14 或更高版本，详见设置要求。

配置问题

配置不匹配 错误: 变更 capacitor.config.json 不会生效。修复: 确保 appId 和 webDir 值与您的项目 package.json 和 Web 构建输出目录
匹配。 错误: 运行 npx cap sync 会导致插件版本冲突。修复: 更新 @capacitor/android 和 @capacitor/ios 到相同的主要版本号，然后重新运行同步命令。

构建和部署

构建签名失败 错误: iOS 或 Android 构建因缺少证书或密钥库而失败。修复:按照IDE的设置指南进行操作。对于iOS，需要在Xcode中添加开发团队。对于Android，需要在keystore中配置 build.gradle.
Web目录未找到 错误: npx cap sync 无法找到Web资源。修复:在同步平台之前，运行您的Web构建命令（例如 npm run build)

实时更新问题

Capgo更新失败 错误:更新未出现在生产应用程序中。修复: 检查一下 Capgo API 在 capacitor.config.json 并确保您正在目标正确的渠道。

有关平台特定设置的更多详细信息，请参阅 Platform Setup 部分。如果您正在使用实时更新，请参阅 Capgo Setup Guide 以获取更多故障排除提示。

概要

设置审查

使用 Capacitor CLI 启动您的 Web 应用，设置 iOS 和 Android 平台，并可选地包含 Capgo 以支持实时更新。

以下是如何开始：

使用 Capacitor CLI 初始化您的项目。
设置您的应用程序的包 ID 并定义 Web 输出目录。
添加 iOS 和 Android 平台的支持。
使用以下命令安装并设置 Capgo: npm install --save @capgo/cli && npx capgo init

详细的设置指南或解决方案，请参阅官方 Capacitor 和 Capgo 文档。