Capacitor CLI: __CAPGO_KEEP_2_

Capacitor CLI 帮助您将 Web 应用程序转换为原生 iOS 和 Android 应用程序，使用一个代码库。 快速设置方法如下：

前提条件: 安装 Node.js (v16+), npm 和一个 Web 框架 (React, Vue, Angular 等)。
安装 Capacitor CLI: 运行 npm install @capacitor/cli @capacitor/core 并初始化您的项目 npx cap init.
准备平台: 添加 iOS (npx cap add ios) 和 Android (npx cap add android) 平台的支持。
构建和同步: 使用 npm run build 和 npx cap sync 将 Web 资产传输到本机项目。
可选实时更新: 使用工具 Capgo 来立即推送更新，而无需等待应用商店延迟。

Capacitor CLI 简化了应用程序开发和维护。按照指南进行平滑的设置和故障排除。

快速构建移动应用！ React + Capacitor + Tailwind + DaisyUI

Capacitor 框架文档网站

开始之前

准备好环境的步骤如下：

设置 Node.js 和 npm

Node.js

您需要安装 Node.js 的 16 或更高版本。推荐使用最新的 LTS 版本。要检查您的设置，请运行：

node --version
npm --version

如果您需要更新，请从官方网站下载 Node.js（包含 npm）

确认 Node.js 准备好后，请确保您的 Web 项目满足必要的 Capacitor 要求

检查您的 Web 项目

您的 Web 项目应该具有以下内容

一个有效的 package.json: 确保它正确配置
一个构建目录: 这是您的 Web 资产所在的地方（通常是 dist 或 www).
一个入口点: 您的构建目录必须包含一个 index.html 文件。

以下是关键字段的快速查看: package.json 必填字段

示例值	目的	name
“my-app”	识别项目	version
指定应用程序版本	“1.0.0”	__CAPGO_KEEP_0__
构建目录	“dist” or “www”	指向 Web 资产

一旦您的 Node.js 和 Web 项目准备就绪，请转到安装平台特定工具。

安装必需软件

对于 Android 开发：

下载并安装最新版本的 Android Studio.
设置 Android SDK，至少需要 API level 22。
配置 ANDROID_HOME 环境变量

对于 iOS 开发（仅限 Mac）：

安装 Xcode 14 或更新版本。
安装命令行工具。
使用 Homebrew 来安装 CocoaPods:
```
brew install cocoapods
```
接受Xcode许可证：
```
sudo xcodebuild -license accept
```

当您稍后将Capgo集成时，请确保您有稳定的互联网连接和有效的SSL证书。

完成这些步骤后，您就可以顺利进行Capacitor开发过程了。接下来，您将安装Capacitor的Capacitor和CLI。

安装Capacitor的CLI

环境准备就绪后，接下来是安装和配置 Capacitor CLI。

添加 Capacitor 包

首先使用 npm 安装 Capacitor CLI 和核心包

npm install @capacitor/cli @capacitor/core

安装完成后，请确认设置通过检查 Capacitor CLI 版本:

npx cap --version

设置您的项目

使用以下命令在您的项目中初始化 Capacitor

npx cap init

在初始化期间，您将被要求提供以下详细信息：

设置	描述	示例
应用名称	在应用商店中显示的名称	“My Awesome App”
App ID	您的应用的唯一标识符	“com.mycompany.myapp”
Web 目录	指向您的 Web 资产的路径	“dist” or “www”

接下来，更新您的配置文件（capacitor.config.ts or capacitor.config.json设置 iOS 和 Android

import { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  appId: 'com.mycompany.myapp',
  appName: 'My Awesome App',
  webDir: 'dist',
  bundledWebRuntime: false
};

export default config;

Set Up iOS and Android

使用以下命令添加 iOS 和 Android 平台支持：

npx cap add ios
npx cap add android

这将生成本机项目：

iOS: 创建包含 Xcode 项目的文件夹。 ios Android
: 创建 Android Studio 项目的文件夹。在修改您的 Web 资产后，运行以下命令以构建和同步： android 此过程将编译您的 Web 资产并将其转移到本机项目中，包括已安装的

__CAPGO_KEEP_0__

npm run build
npx cap sync

插件。 Capacitor plugins.

iOS

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

现在你准备好测试你的设置并解决可能出现的问题了。

解决常见问题

当设置Capacitor CLI时，你可能会遇到一些常见的问题。以下是解决方法：

Android Gradle 问题

如果你遇到Gradle相关的问题，尝试以下步骤：

导航到Android目录并清除构建缓存：
```
cd android
./gradlew cleanBuildCache
```

更新 android/build.gradle:

buildscript {
    ext {
        gradleVersion = '8.1.0'
    }
}

在 android/gradle.properties 添加以下行

org.gradle.jvmargs=-Xmx4608m
org.gradle.parallel=true

以获得更好的性能：

如果问题仍然存在，请重新检查你的设置或参考额外的故障排除资源。

应用程序显示空白屏幕

检查 Web 目录路径: 确保与构建输出匹配。 webDir 验证服务器配置

const config: CapacitorConfig = {
    webDir: 'dist', // Adjust if necessary
};

: 确认服务器设置是否正确。更新内容安全策略

server: {
    url: 'http://localhost:3000',
    cleartext: true
}

: 为资源加载添加此元标记到您的 HTML 中。插件未工作

<meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline' 'unsafe-eval' data: *">

如果插件未按预期工作，请遵循以下步骤：

清洁安装依赖项：

检查插件设置在

rm -rf node_modules
npm cache clean --force
npm install

以确保它们已正确配置： capacitor.config.ts __CAPGO_KEEP_0__

plugins: {
    PluginName: {
        option: 'value'
    }
}

对于使用 Capgo的原生插件的用户来说，它会自动同步插件并在更新时维持兼容性。

在应用这些修复后，请重建您的项目以验证更改：

npm run build && npx cap copy && npx cap sync

Once everything is running smoothly, you can move forward with exploring live update options with Capgo.

__CAPGO_KEEP_0__ Capgo

Capgo Live Update Dashboard Interface

__CAPGO_KEEP_0__ __CAPGO_KEEP_0__ using Capgo. It lets you push updates directly to users, skipping the need for app store reviews.

简化应用更新使用 首先，安装必要的包：

npm install @capgo/cli @capgo/capacitor-updater
npx cap sync

然后，在您的项目中初始化 Capgo：

npx @capgo/cli init

定价计划

Capgo 提供多个定价计划以满足不同需求：

计划	月活跃用户	带宽	存储	年费（美元）
SOLO	1,000	50 GB	2 GB	$12/月
MAKER	10,000	500 GB	5 GB	$33/月
TEAM	100,000	2,000 GB	10 GB	$83/月

针对企业用户，PAYG 计划从 $249/月开始，包括 API 访问权限、自定义域名和专属支持。

实时更新配置

要启用实时更新，请在您的 capacitor.config.ts file:

{
  plugins: {
    CapacitorUpdater: {
      autoUpdate: true,
      updateUrl: 'https://api.capgo.app/updates'
    }
  }
}

关键功能

Capgo 提供了以下几个突出的功能:

安全更新 使用端到端加密
自动部署 通过集成的CI/CD
目标更新 通过用户分配
即时回滚 使用版本控制
实时分析 To track updates

发布命令

在开发环境中测试更新之前，部署到线上。使用以下命令:

发布到测试环境:
```
npx @capgo/cli deploy --channel staging
```

发布到生产环境:

npx @capgo/cli deploy --channel production

Capgo 确保了与苹果和安卓的指南相符，因此您的线上更新不会冒着被应用商店违规的风险。它是管理 Capacitor 应用程序的高效方式，尤其是在安装后。

结论

设置 Capacitor CLI 很简单，只要您有合适的前置条件。这种设置确保了应用程序更新更加顺畅，开发工作流更加高效。

现代工具使应用程序维护变得比以往任何时候都更容易。例如，Capgo 现在提供了实时更新，取代了旧的方法。它与 CLI 安装的集成使其成为开发者在开发 Capacitor 应用程序时的理想选择。

The Capacitor 生态系统不断地通过新工具和功能而改进。安装 CLI 只是开发者工作流的起点。开发移动应用, 并且您将从详细的文档和活跃的开发者社区中受益。

请确保保留 Capacitor CLI 和其包的最新版本，以避免兼容性问题。

从安装 Capacitor CLI: 步骤指南

如果您正在使用 安装 Capacitor CLI: 步骤指南 来规划仪表板和 API 操作，连接它 API 概览在 API 概览中了解实现细节介绍在介绍中了解实现细节 API 密钥关于API Keys的实现细节设备关于设备的实现细节捆绑包关于捆绑包的实现细节

Capacitor CLI 安装指南