Skip to content
Capgo - Live Updates for Capacitor Apps Capgo

CLI オンボーディングガイド

Quick Overview

「Quick Overview」というセクション

The Capgo CLI provides an interactive onboarding that sets up live updates for your Capacitor app. You’ll:

  1. ✅ Capgo Capgoにアプリケーションを登録します。
  2. 🔌 プラグインのアップデート設定をインストールして構成する
  3. 🚀 最初のライブアップデートをデプロイする
  4. 📱 デバイス上でアップデートをテストする

推定時間: 10-20分 (インターネット速度とビルド時間に応じて変わります)

オンボーディングの開始

「オンボーディングの開始」のセクション

API キーとともにオンボーディングコマンドを実行する:

ターミナルウィンドウ
npx @capgo/cli@latest init [APIKEY]

ようこそメッセージが表示されます:

Capgo onboarding 🛫

オンボーディングの流れ

「オンボーディングの流れ」セクション

CLIは、13ステップのインタラクティブなガイドを提供します:

セットアップフェーズ（ステップ1-6）：

  • 開発環境（Xcode/Android Studio）を確認する
  • Capgoにアプリを追加し、生産チャンネルを作成する
  • __CAPGO_KEEP_1__ @capgo/capacitor-updater __CAPGO_KEEP_2__
  • Inject the required code into your app
  • オプションでエンドツーエンド暗号化を有効にする
  • テスト用にプラットフォームを選択してください (iOS または Android)

テストフェーズ (ステップ 7-12):

  • アプリをビルドし、デバイス/エミュレータで実行する
  • 自動または手動で code に表示される変更を実行する
  • 更新されたバンドルを Capgo にアップロードする
  • 実行中のデバイスでリアルタイムで更新を確認する

完了 (ステップ 13):

  • アプリはライブ更新に準備できました! 🎉

13ステップのオンボーディングプロセス

セクションのタイトル “13ステップのオンボーディングプロセス”

ステップ 1: 必要な前提条件を確認する

Step 1: Prerequisites Check

The CLI checks your development environment to ensure you have the necessary tools installed.

確認されるもの:

  • Xcode (macOSのみ) - iOS開発用
  • Android SDK - Android開発用

可能な結果:

✅ 両方の環境が見つかりました:

✅ Xcode detected - iOS development ready
✅ Android SDK detected - Android development ready

⚠️ 環境が見つかりませんでした:

⚠️ Xcode not found
⚠️ Android SDK not found
❌ No development environment detected


📱 To develop mobile apps with Capacitor, you need:
   • For iOS: Xcode (macOS only) - https://developer.apple.com/xcode/
   • For Android: Android Studio - https://developer.android.com/studio

質問を受けるかもしれません:

ステップ 2: アプリを追加

ステップ 2: アプリを追加

CLI は Capgo にログインし、アプリをアカウントに追加します。

(spinner) Running: npm @capgo/cli@latest login ***
Login Done ✅


❓ Add {appId} in Capgo?

アプリ ID がすでに取られている場合:

CLI は代替案を提案します:

❌ App ID "com.example.app" is already taken
💡 Here are some suggestions:
   1. com.example.app2
   2. com.example.app3
   3. com.example.app.new
   4. com.example.app.app


❓ What would you like to do?

代替案を選択したり、カスタムのアプリ ID を入力したりできます。

ステップ 3: 生産チャンネルを作成する

「ステップ 3: 生産チャンネルを作成する」セクション

チャンネルは、異なるアップデートストリームを管理するためにアプリを使用します。

❓ Create default channel production for {appId} in Capgo?

Yes を選択した場合:

(spinner) Running: npm @capgo/cli@latest channel add production {appId} --default
Channel add Done ✅  (or "Channel already added ✅")

プロダクション チャンネルが作成され、デフォルトに設定されます。このオプションは、ほとんどのユーザーにとって推奨されるオプションです。

No を選択した場合:

If you change your mind, run it for yourself with: "npm @capgo/cli@latest channel add production {appId} --default"

チャンネルを作成し、後で設定する必要があります。代わりに、

  • ファイル capacitor.config.ts JavaScript
  • チャンネルを動的に設定する方法 setChannel() 後で __CAPGO_KEEP_0__ Web コンソールからチャンネルを設定する
  • Configure channels later from the Capgo web console

Step 4: Capgo Updater Pluginをインストール

Section titled “Step 4: Capgo Updater Pluginをインストール”

CapgoはCLIのバージョンに適合した @capgo/capacitor-updater plugin compatible with your Capacitor version.

❓ Automatic Install "@capgo/capacitor-updater" dependency in {appId}?

バージョン互換性:

  • Capacitor 5Capgo 5: インストール @capgo/capacitor-updater v5
  • Capacitor 6Capgo 6: インストール @capgo/capacitor-updater v6
  • Capacitor 7: @capgo/capacitor-updater v7
  • Capacitor 8+:

Instant updates option:

After installation, you’ll be asked:

❓ Do you want to set instant updates in {appId}?
   Read more: https://capgo.app/docs/live-updates/update-behavior/#applying-updates-immediately

If you select Yes:

  • 更新はアプリが背景化されたときに即座に適用されます。
  • autoUpdate: 'always' そして autoSplashscreen: true will be added to your config
  • Your capacitor.config.ts will be updated automatically
  • Delta updates は自動的に有効になります - この機能は、更新間の変更されたファイルのみを送信するため、更新が大幅に高速化されます。

If you select No:

  • アップデートは標準の動作を使用します (バックグラウンドでダウンロード、再起動後に適用)
  • いつでも、インスタントアップデートを有効にするには、設定を変更できます capacitor.config.ts

ステップ 5: インテグレーションを追加 Code

セクションのタイトル “ステップ 5: インテグレーションを追加 Code”

CLI は、必要な code を自動的にメインアプリケーションファイルにインジェクトします

❓ Automatic Add "CapacitorUpdater.notifyAppReady()" code and import in {appId}?

追加されるもの:

import { CapacitorUpdater } from '@capgo/capacitor-updater'


CapacitorUpdater.notifyAppReady()

プロジェクトタイプの検出:

  • ナウツ: 作成 plugins/capacitorUpdater.client.ts
  • その他のフレームワーク:アシイトは、今要モーバート、モーバートを定义。

ステップ 6:暗号化の設定 (オプション)

ステップ 6:暗号化の設定 (オプション) のセクション

エンドツーヨー暗号化は、更新のセキュリティ層を追加します。

🔐 End-to-end encryption
   ✅ Use this for: Banking, healthcare, or apps with legal encryption requirements
   ⚠️  Note: Makes debugging harder - skip if you don't need it


❓ Enable end-to-end encryption for {appId} updates?

CLI を有効にすると、次のことが行われます。

  1. 暗号化キーを生成
  2. Capacitor の構成を同期するオファー

ステップ 7:プラットフォームの選択

Step 7: Platformの選択

新規登録の際にテストするプラットフォームを選択してください。

📱 Platform selection for onboarding
   This is just for testing during onboarding - your app will work on all platforms


❓ Which platform do you want to test with during this onboarding?
   Options:
   - iOS
   - Android

Step 8: プロジェクトのビルド

Step 8: プロジェクトのビルド

The CLI will build your app and sync it with Capacitor.

❓ Automatic build {appId} with "npm run build"?

次のことが起こります:

  1. プロジェクトの種類を検出します
  2. ビルドスクリプトを実行します。
  3. 実行します。 npx cap sync {platform}

ビルドスクリプトが存在しない場合:

ビルドスクリプトを追加するか、スキップするかを尋ねられます。 package.json.

ステップ 9: デバイスで実行

ステップ 9: デバイスで実行

デバイスまたはエミュレータでアプリの初期バージョンをテストします。

❓ Run {appId} on {PLATFORM} device now to test the initial version?

ビルドスクリプトが存在しない場合: はい:

(spinner) Running: npx cap run {platform}
(device picker appears)
App started ✅
📱 Your app should now be running on your {platform} device with Capgo integrated
🔄 This is your baseline version - we'll create an update next

ステップ 10: テスト変更

Step 10: Make a Test Change”を示すセクションのタイトル

ここで、Capgoの更新システムをテストするために、可視的な変更を実行してみましょう。

🎯 Now let's test Capgo by making a visible change and deploying an update!


❓ How would you like to test the update?
   Options:
   - Auto: Let Capgo CLI make a visible change for you
   - Manual: I'll make changes myself

オートモード: CLIは、可視的なテストバナーを追加したり変更したりするために、自動的にファイルを変更します。

マニュアルモード: 自分で変更を実行します（例：テキストを変更、色を変更、要素を追加）。

バージョン管理:

❓ How do you want to handle the version for this update?
   Options:
   - Auto: Bump patch version ({currentVersion} → {nextVersion})
   - Manual: I'll provide the version number

変更を含むビルド:

❓ Build {appId} with changes before uploading?

ステップ11：アップロード バンドル

ステップ11：アップロード バンドル

Capgoにアップロードしたアプリケーション バンドルをアップロードしてください。

❓ Upload the updated {appId} bundle (v{version}) to Capgo?

The CLI runs:

クリップボードにコピー
npx @capgo/cli@latest bundle upload

Delta 更新のプロンプト (即時適用モードが有効の場合):

💡 Instant updates are enabled in your config
   Delta updates send only changed files instead of the full bundle


❓ Enable delta updates for this upload? (Recommended with instant updates)

Success:

✅ Update v{version} uploaded successfully!
🎉 Your updated bundle is now available on Capgo

Step 12: デバイスでアップデートをテストする

ステップ 12: デバイスでアップデートをテストする

実際にアップデートが動作するのを見てみましょう!

🧪 Time to test the Capgo update system!
📱 Go to your device where the app is running

即時アップデートの場合:

🔄 IMPORTANT: Background your app (swipe up/press home button) and then reopen it
⏱️  The update should be downloaded and applied automatically

標準アップデートの場合:

📱 With standard updates, you will need to:
   1. Background the app (swipe up/press home button) to start download
   2. Wait a few seconds for download to complete
   3. Background and foreground again to see the update

ログの監視:

❓ Monitor Capgo logs to verify the update worked?

あなたが「はい」を選択すると あなたは、デバイスからアップデートプロセスを実行中のライブログを見ることができます。クリップボードにコピー

Step 13: Completion

Section titled “Step 13: Completion”
Welcome onboard ✈️!

おめでとうございます！あなたはアプリのCapgoライブアップデートを成功させました。

あなたが達成したこと

Section titled “あなたが達成したこと”

オンボーディングを完了したあと、次のことが実行されます:

✅ アプリの登録

あなたのアプリはCapgoにプロダクションチャンネルで登録されています

✅ プラグインのインストール

Capacitorアップデートプラグインはインストールされています

✅ Code統合

アプリに統合 code が追加されました

✅ Update Tested

あなたは成功でデプロイし、ライブアップデートを受け取りました

毎日のワークフロー

セクション「毎日のワークフロー」

次回のアップデートについては、以下の手順に従ってください

ターミナル画面
npm run build
npx @capgo/cli@latest bundle upload --channel=production

さらにデプロイオプションについては、以下のページを参照してください ライブアップデートをデプロイする.

オンボーディングを再開する

セクション「オンボーディングを再開する」

プロセスを中断してもいつでも再開できます:

ターミナルウィンドウ
npx @capgo/cli@latest init [APIKEY]

次のようになります:

You have already got to the step {stepNumber}/13 in the previous session
❓ Would you like to continue from where you left off?

トラブルシューティング

「トラブルシューティング」のセクション

開発環境が存在しない

「開発環境が存在しない」のセクション

問題: XcodeもしくはAndroid SDK が検出されませんでした。

解決策:

  • iOSの場合: インストール Xcode (macOS専用)
  • Androidの場合: インストール Android Studio

アプリIDがすでに取られています。

「アプリIDがすでに取られています。」というセクション

問題: あなたのアプリIDはすでに登録されています。

解決策: 提案された代替の1つを選択するか、逆ドメイン記法でカスタムアプリIDを入力してください。

ビルドスクリプトが見つかりません

「ビルドスクリプトが見つかりません」セクション

問題: ビルドスクリプトが package.json.

解決策: あなたの package.json:

{
  "scripts": {
    "build": "your-build-command"
  }
}

自動インジェクション失敗

セクションのタイトル “Auto-Injection Failed”

問題: CLI は、code の自動インジェクションを実行できません。

解決策: code を手動でメインファイルに追加してください:

import { CapacitorUpdater } from '@capgo/capacitor-updater'


CapacitorUpdater.notifyAppReady()

Capacitor のバージョンが古すぎる

セクションのタイトル “Capacitor Version Too Old”

問題: Capacitor のバージョンが v5 未満です。

解決策: Capacitor を v5 またはそれ以上のバージョンにアップグレードしてください:

次のステップ

セクション「次のステップ」

オンボーディングを完了しました。以下のトピックをご覧ください。

一度の設定チェックリスト

長期の安定性のために、チャンネル、CI、デルタアップロードを一度に設定してください。

デプロイ

Capgo ダッシュボードからアップデートをデプロイする方法を学びましょう。

アップデートの種類

OTAアップデートの種類のリファレンス: アプリケーションタイミング、遅延条件、バージョンブロッキング、配信

CI/CD統合

CI/CDを使用して自動的にアップデートのデプロイを実行

チャンネル

Capgoのリリースチャンネル機能名。Capgoのソリューションズマーケティングページ。短いUIラベルまたはナビゲーションアイテム。ソリューションズ/ホワイトラベル.astroページに表示

複数のアップデートストリームを管理するチャンネル

暗号化

アップデートをセキュリティで保護するエンドツーヘンド暗号化

アップデートの動作

アップデートの適用時期と方法をカスタマイズする(直接、デルタなど)

ヘルプ

トラブルシューティング用のヘルプ

Keep going from CLI Onboarding Guide

Section titled “Keep going from CLI Onboarding Guide”

「続けてください」オンボーディング ガイド CLI Onboarding Guide to plan dashboard and API operations, connect it with API オーバービュー API オーバービューの実装詳細について 導入 導入の実装詳細について API キー API キーの実装詳細について デバイス デバイスの実装詳細について、そして バンドル バンドルの実装詳細について。