Capacitor CLI: プロジェクトセットアップガイド

コンテンツマーケティング Capacitor CLIはプロセスを簡素化し、ウェブ技術を使用してネイティブアプリを作成できるようにします。ここでは、学びます。

クイックセットアップ: CapacitorとCLIをインストールし、プロジェクトを初期化するのに数分で完了します。
プラットフォーム統合: iOSとAndroidのサポートを簡単なコマンドで追加します。
ライブアップデート: : Capgoを使用して、即時オーバー・ザ・エア更新を実行します。共通の修正
: 同期エラーまたはビルドエラーなどの問題をトラブルシューティングします。開始するための重要なステップ:

__CAPGO_KEEP_0__はプロセスを簡素化し、ウェブ技術を使用してネイティブアプリを作成できるようにします。ここでは、学びます。

インストール Node.js, npm, JDK Xcode, および Android Studio.
実行 npm install @capacitor/core @capacitor/cli プロジェクトを初期化する
iOS と Android プラットフォームを追加するには 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!

Introducing Capacitor Configure

Capacitor Framework Documentation Website

セットアップ要件

Node.js

(バージョン 14 または新しい) と Capacitor npm
__CAPGO_KEEP_0__ (バージョン 11 または新しい)
Xcode (バージョン 12 または新しい iOS ビルド用)
Android Studio (Android ビルド用)
Capacitor CLI オプション:

ライブ更新を有効にする場合は、「 __CAPGO_KEEP_0__ セットアップガイド」Capgo Setup Guide__CAPGO_KEEP_0__ インストールステップ

Optional: If you want to enable live updates, check out the “CLI Setup Guide” below.

はじめる前に、 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 __CAPGO_KEEP_1__

をインストールできます。 このコマンドは __CAPGO_KEEP_0__

新しいプロジェクトの作成

プロジェクトを始めるには 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 設定を更新したら、__CAPGO_KEEP_0__ をプロジェクトに設定するために使用します。

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

Once updated, use this configuration to set up Capacitor for your project.

プロジェクトの骨格ができたので、iOS と Android のターゲットを設定する時です。

iOS と Android の追加

まず、必要なプラットフォーム固有のパッケージを __CAPGO_KEEP_0 CAPGO_KEEP_1__ を使用してインストールしてください。

Start by installing the necessary platform-specific packages using the 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 またはそれ以降が必要です。 Gradle Capacitor CLIをインストールした後、ウェブアプリケーションの変更に合わせてネイティブのターゲットを最新の状態に保つ必要があります。

プラットフォームの更新

ウェブアプリケーションを更新した後、最新のウェブの変更と同期するには、次の手順に従ってください。

コマンドは2つのタスクを処理します。

npm run build
npx cap sync

ウェブアセットをネイティブプラットフォームにコピーします。 cap sync ネイティブの構成とプラグインを最新の変更に合わせて更新します。

The
command handles two tasks:

IDEの設定

適切なIDEでプラットフォーム固有のプロジェクトを開きます:

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

Xcodeで:

開発チームを選択してください。
署名証明書を設定してください。
バンドル識別子を更新してください。

Android Studioで:

アプリケーションIDを変更してください。 build.gradle.
署名用のキーストアを設定してください。
デバッグとリリースのビルドバリアントを両方とも設定してください。

設定が完了したら、プロジェクトを npx cap build ios または npx cap build androidCapgoを実行してください。 npx cap sync すべてのアセットが最新であることを確認するために再度実行してください。

Capgo セットアップガイド

Capgo Live Update Dashboard インターフェース

Capgoを設定して、即時オーバー・ザ・エア更新を有効にすることができます。

Capgoの主な機能

Capgoは、以下のツールを提供して、アプリの更新を簡素化します:

エンドツーエンド暗号化 エンドツーエンド暗号化
は、更新の安全な配信を保証します。 更新はバックグラウンドで実行されます アプリ起動時
分析ツール ユーザーとの関わりやアップデートの成功率を追跡するのに役立ちます。
A 問題のあるアップデートから回復するための オプションを一クリックで使用できます。
チャンネルシステム ステージングリリースやベータテストに使用します。 __CAPGO_KEEP_0__のインストール

Capgoを使用するには、以下の手順に従ってください。

Capgoと__CAPGO_KEEP_1__をインストールします。

Install the Capgo CLI:
```
npm install --save @capgo/cli
```
Capgoを初期化するプロジェクト内で
```
npx capgo init
```
更新をビルドおよびリリースする:
```
npm run build
npx capgo release
```
アプリを開いてバックグラウンドの更新プロセスをトリガーする。

ベストプラクティス

チャンネルを使用して、すべてのユーザーにロールアウトする前にアップデートをテストする。
分析を監視して、更新が正常に配信され、ユーザーが関与していることを確認する。
エラー追跡を有効にして、問題を早期に発見して修正する。
ロールバック機能を準備して、迅速に問題を解決する。

CapgoはCapacitor 8と互換性があり、CI/CD PipelinesとSmoothに統合され、AppleおよびGoogleストアの要件に準拠しています。

一般的な問題とアドバイス

プラットフォームおよびCapgoのセットアップを完了した後、一般的なエラーに直面するかもしれません。ここでは、迅速に解決する方法を紹介します。

環境設定の問題

CLI Not Found エラー: __CAPGO_KEEP_0__ コマンドが実行できません。 npx cap 解決策 : Node.js を再インストールし、再度試してください。Node のバージョンが一致しません npm install --save @capacitor/cli @capacitor/core エラー
: __CAPGO_KEEP_0__ コマンドが実行できません。Node.js のバージョンが一致していません。 解決策Node.js のバージョンが一致していないため、CLI コマンドが実行できません。 解決策: Node.js 14 以上をインストールしてください。

設定問題

構成不一致 エラー: capacitor.config.json 変更は反映されません。修正: プロジェクトの設定値と appId とウェブビルド出力フォルダの値が一致していることを確認してください。 webDir プラットフォーム同期エラー package.json と
の エラー:実行 npx cap sync 結果はプラグインバージョンコンフリクトになります。修正:アップデート @capacitor/android と @capacitor/ios context:Capgoマーケティングサイト。役割:短いUIラベルまたはナビゲーションアイテム。ページ/エリア:trust.astroページ。メッセージキー`と` (And)。

同じメジャーバージョンにアップデートし、再度syncコマンドを実行してください。

ビルドとデプロイ ビルド署名エラーエラー :iOSまたはAndroidビルドが、証明書またはキーストアが欠如しているため失敗します。: IDEの設定手順に従ってください。iOSの場合、Xcodeで開発チームを追加してください。Androidの場合、キーストアを設定してください。 build.gradle.
Webディレクトリが見つかりません。 エラー: npx cap sync 更新できません。 : Webアセットが見つかりません。修正 npm run build: Webビルドコマンドを実行してください(例えば、

) して、プラットフォームを同期する前に。

Capgo Update Failures __CAPGO_KEEP_0__の更新失敗エラー : 生産アプリで更新が表示されません。: __CAPGO_KEEP_0__ を確認してください。 Capgo API キーを確認し、正しいチャネルをターゲットにしていることを確認してください。 in capacitor.config.json プラットフォーム固有のセットアップに関する詳細については、Platform Setup セクションを参照してください。ライブ更新を使用している場合は、__CAPGO_KEEP_0__ セットアップガイドを参照してください。追加のトラブルシューティングのヒントが得られます。

For more details on platform-specific setup, revisit the Platform Setup section. If you’re working with live updates, consult the Capgo Setup Guide for additional troubleshooting tips.

セットアップレビュー

__CAPGO_KEEP_0 CAPGO_KEEP_1 でウェブアプリを開始し、iOS と Android プラットフォームをセットアップし、オプションでライブ更新用に CAPGO_KEEP_2__ を含めることができます。

Start your web app with Capacitor CLI, set up iOS and Android platforms, and optionally include Capgo for live updates.

__CAPGO_KEEP_0__ __CAPGO_KEEP_1__ を使用してプロジェクトを初期化します。

Use the Capacitor CLI to initialize your project.
iOS と Android プラットフォームのサポートを追加します。
__CAPGO_KEEP_0__ __CAPGO_KEEP_1__ を使用してプロジェクトを初期化します。
Capgoをインストールして設定するには、以下のコマンドを実行してください。 npm install --save @capgo/cli && npx capgo init

詳細な設定方法やトラブルシューティングについては、公式のCapacitorとCapgoドキュメントを参照してください。

Capacitor CLIから続けてください: プロジェクト設定ガイド

Capacitor CLIを使用している場合 Capacitor CLI: Project Setup Guide Capacitor CLIを使用してダッシュボードとAPIのオペレーションを計画する場合、APIと接続してください。 API Overview APIの概要の実装詳細については、Capacitor CLIの概要を参照してください。導入導入の実装詳細については、導入を参照してください。 APIのキー APIのキーについての実装詳細については、APIのキーを参照してください。デバイスデバイスの実装詳細についてバンドルバンドルの実装詳細について。

Capacitor CLI: Project Setup Guide