How to Customize Build Scripts with Capacitor CLI

Capacitor CLI lets you customize your app’s build process for iOS, Android, and web platforms. By tweaking build scripts, you can:

アップデートを高速化する: アプリストアの遅延なしで即時変更を反映させる
デプロイを制御する: 更新をロールバックするか、特定のユーザーグループにターゲットする
アプリをセキュアにする: 更新を暗号化して保護する
ビルドを最適化する: プラットフォーム固有のニーズに合わせて設定を調整する

主な機能のクイックオーバー:

構成ファイル: capacitor.config.json と package.json ビルド設定を管理する。
カスタムスクリプト: ビルド前の作業とビルド後の作業を自動化するためにプレビルドとポストビルドタスクを追加します。
ビルドハンドル: code をビルドプロセスの特定の段階で実行します。
環境変数: 環境に応じたビルドを簡素化するために .env ファイル

: Capgoコンテキスト: HTML テキストフラグメント (親キー `submitting_a_pr_to_capgo`。ページ/エリア: Capgo マーケティングウェブサイト。役割: ウェブサイトコピー。見つかった場所: contributing.astro ページ。Capgo の製品/ブランドと開発者用語を完全に保持します。 , デプロイメントツールとして機能し、自動更新、バージョン追跡、およびグローバルパフォーマンス最適化を含むこのプロセスを強化します。自動化された更新、バージョン追跡、およびグローバルパフォーマンス最適化を含むこのプロセスを強化します。

__CAPGO_KEEP_0__ Capacitor Capacitor

Capacitor Framework Documentation Website

Default Build Process in Capacitor

Understanding how Capacitor handles its default build process is crucial if you want to customize it effectively. Below, we’ll break down the Capacitor CLI’s build process and its key configuration files.

Capacitor

Capacitor uses a step-by-step process to transform your web app into platform-specific builds. Here’s what happens during the default build process:

Capacitor	Capacitor	Capacitor
Web ビルド	フレームワークツールを使用してWebアセットをコンパイルします。	最適化されたWebバンドル
アセットのコピー	ネイティブプラットフォームフォルダにWebアセットを移動します。	プラットフォーム固有のアセットディレクトリ
ネイティブビルド	プラットフォーム固有のビルドコマンドを実行します。	展開可能なバイナリ
検証	ビルドの整合性と依存関係を確認します。	ビルドのステータスと警告

メイン設定ファイル

2 つの重要な設定ファイルが Capacitor がビルドを管理する方法を決定します:

capacitor.config.json
Capacitor プロジェクトの主な設定ファイルです。ビルドの重要なパラメータを設定します:

{
  "appId": "com.example.app",
  "appName": "MyApp",
  "webDir": "dist",
  "bundledWebRuntime": false,
  "plugins": {
    "SplashScreen": {
      "launchShowDuration": 3000
    }
  }
}

appId: アプリのユニークな識別子です。
appName: アプリの名前です。
webDir: Capacitor がウェブアセットを探す場所を指定します (例えば、) dist).
plugins: プラグイン固有の設定を構成できます、例えばSplashScreenオプション。

package.json
このファイルにはビルドスクリプトと依存関係が含まれ、ビルドプロセスに影響を与えます:

{
  "scripts": {
    "build": "npm run build:web && cap sync",
    "build:web": "vite build",
    "cap:build": "cap build"
  }
}

: webDir : capacitor.config.json Capacitor CLIでCapacitorにコンパイルされたWebアセットの場所を指定します。
変更を加えた後は capacitor.config.json__CAPGO_KEEP_0__を実行してください。 cap sync nativeプロジェクトが最新の状態であることを確認するために

この記事では、Capacitor CLIの設定をカスタマイズする方法について詳しく説明します。

ビルドスクリプトの変更

You can tweak Capacitor’s default build process to better suit your project needs. Here’s how:

ビルド設定

ビルドプロセスを変更するには、 capacitor.config.json ファイルを編集します。以下に例の設定があります。

{
  "appId": "com.example.app",
  "webDir": "www",
  "server": {
    "hostname": "localhost",
    "androidScheme": "https",
    "iosScheme": "https",
    "allowNavigation": ["*.example.com"]
  },
  "android": {
    "buildOptions": {
      "keystorePath": "release.keystore",
      "keystorePassword": "mypassword",
      "keystoreAlias": "release",
      "keystoreAliasPassword": "mypassword"
    }
  },
  "ios": {
    "scheme": "App",
    "automaticProvisioning": true
  }
}

以下の設定を変更できます。

webDirコンパイルされたWebアセットの場所を指定します。
server: __CAPGO_KEEP_0__を設定します。開発サーバー、ホスト名、ナビゲーション許可を含みます。
android/ios: プラットフォーム固有のビルド設定を許可します。Androidのキーストア詳細やiOSのプロビジョニングオプションなど。

Capacitor CLIでNPMスクリプトを作成する

ワークフローを簡素化するには、カスタムNPMスクリプトを追加します。ここに例があります。 package.json ファイルに追加します。

{
  "scripts": {
    "prebuild": "node ./scripts/prepare-env.js",
    "build": "npm run build:web && cap sync",
    "build:web": "vite build",
    "build:ios": "cap build ios --release",
    "build:android": "cap build android --release",
    "postbuild": "node ./scripts/notify-completion.js"
  }
}

prebuild ページの信頼性を高めるために、ページの信頼性を高めるために使用します。 postbuild: ビルドが完了したときに通知を送信したり環境を設定したりするようなタスクに使用します。
build:platform: AndroidアプリやiOSアプリをビルドするためのプラットフォーム固有のコマンドです。

ビルドの自動化をさらに進めるには、ビルドの特定のポイントでカスタム__CAPGO_KEEP_0__を実行するビルドのハックを追加します。

ビルドのハックの設定

ビルドのハックを使用すると、ビルドプロセスの特定のポイントでカスタムcodeを実行できます。ここに例があります。 capacitor.config.ts:

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

const config: CapacitorConfig = {
  appId: 'com.example.app',
  plugins: {
    CapacitorHooks: {
      beforeBuild: async () => {
        console.log('Running pre-build tasks...');
        // Add your pre-build tasks here
      },
      afterBuild: async () => {
        console.log('Running post-build tasks...');
        // Add your post-build tasks here
      }
    }
  }
};

export default config;

ビルドのハックを使用すると、次のようなことができます。

ビルドが開始される前に要件を検証する
ビルドプロセス中にアセットを変換する
重要なポイントで通知をトリガーする
バージョン番号を自動的に更新する
自動テストをスムーズに実行する

このアプローチは、ビルドライフサイクルの全体に大きな柔軟性と制御を提供します。

高度なビルドカスタマイズ

大規模なプロジェクトで作業している場合、ビルドプロセスを微調整すると大きな違いが生まれます。ここでは、環境固有のビルドとプラットフォームカスタマイズを効果的に管理する方法を紹介します。

環境変数

環境変数を設定するには、各環境用に別々の .env ファイルを作成します。

.env.development
.env.staging
.env.production

次に、ビルドスクリプトを環境に応じて適切なファイルを読み込ませるように設定します。

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

export default defineConfig({
  ios: {
    buildConfig: {
      environment: process.env.BUILD_ENV || 'development',
      configurations: {
        development: {
          signing: {
            debug: true,
            automaticProvisioning: true
          }
        },
        production: {
          signing: {
            release: true,
            provisioningProfile: 'dist/profile.mobileprovision'
          }
        }
      }
    }
  }
});

これらの設定をさらに調整して、プラットフォーム固有の要件に合わせることができます。

プラットフォーム固有のビルド

AndroidとiOSのビルドをカスタマイズするには、以下の構造を使用してください。

const platformConfig = {
  android: {
    buildType: process.env.BUILD_TYPE || 'debug',
    keystoreConfig: {
      path: process.env.KEYSTORE_PATH,
      password: process.env.KEYSTORE_PASSWORD,
      alias: process.env.KEYSTORE_ALIAS
    }
  },
  ios: {
    scheme: process.env.APP_SCHEME || 'App',
    xcodePreferences: {
      automaticSigning: false,
      developmentTeam: process.env.DEVELOPMENT_TEAM
    }
  }
};

これらの設定により、各プラットフォームのビルドをカスタマイズし、スムーズなデプロイを実現できます。

機能	Android	iOS
デバッグシンボル	ProGuard マッピングファイル	dSYMファイル
ビルドバリアント	debug, release, staging	debug, release
Code Signing	キーストア管理	プロビジョニングプロファイル
アセット管理	res/drawable 最適化	アセットカタログ

ビルドの最適化に役立つ追加のヒント

デプロイメントの時間を節約するためにパーシャルアップデートを使用する
エラーのトラッキングを設定して、問題を迅速に特定する
ベータテスト用のバージョンを管理するためのチャネルシステムを作成する
エンドツーエンド暗号化を有効にする

Capgoと組み合わせて分析と安全な更新を実行するツールを使用すると、デプロイプロセスに対するコントロールが増えます。 [1].

ビルドスクリプトの問題と修正

カスタムビルド構成を使用する際に、エラーを迅速に解決することは、ビルドプロセスを正常に実行するために不可欠です。

一般的なエラーの修正

環境設定または依存関係の問題が多くのビルドスクリプトの問題の原因です。ここでは、一般的な問題の解決方法を紹介します。

環境変数の欠如

次のようなエラーが発生した場合:

error: Cannot find environment configuration for BUILD_ENV

エラーを解決するには、プロジェクトのルートディレクトリにファイルを作成します。以下の例を参照してください。 .env.local プラットフォーム固有のビルドエラー

BUILD_ENV=development
CAPACITOR_PLATFORM=ios
BUILD_TYPE=debug

Androidの署名エラーの場合、以下のコマンドを実行してください:

__CAPGO_KEEP_0__はCapacitor CLIの分析と安全な更新を実行するツールです。

npx cap build android --keystorePassword=$KEYSTORE_PASSWORD --keystoreAlias=$KEYSTORE_ALIAS

iOS 設定プロファイルの問題の場合、以下を試してください:

npx cap build ios --configuration=release --type=development

エラーの種類	一般的な原因	解決策
署名設定	キーストアの詳細が見つかりません	設定 `KEYSTORE_PATH` と資格情報
ビルド環境	未定義の変数	プラットフォーム固有の `.env` ファイルを作成する
依存関係	バージョン不一致	更新 `package.json` と同期

修正を適用した後、変更が堅牢であることを確認するには、徹底的なビルドテストを実行してください。

ビルドスクリプトのテスト

エラーが解決されたら、次の手順でビルドスクリプトを検証してください:

自動検証: ビルドプロセスが予想どおり動作することを確認するために、重要なコマンドを実行してください。

npm run build
npx cap sync
npx cap copy

環境検証: ビルドを開始する前に、欠落している環境変数を確認してください。

const requiredVars = ['BUILD_ENV', 'KEYSTORE_PATH'];
requiredVars.forEach(varName => {
  if (!process.env[varName]) {
    throw new Error(`Missing required env var: ${varName}`);
  }
});

ビルドスクリプトのデバッグ: Capgo CLI を使用してビルドスクリプトをカスタマイズする方法

{
  "scripts": {
    "build:debug": "NODE_ENV=development npx cap build --verbose",
    "build:release": "NODE_ENV=production npx cap build --verbose"
  }
}

Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法

Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法 Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法 Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法
Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法
Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法 Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法 Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法
Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法
Capacitor CLI を使用してビルドスクリプトをカスタマイズする方法

Capgo ビルド機能

Capgo ライブアップデートダッシュボードインターフェイス

Capgoはビルドスクリプトを次のレベルに引き上げ、自動デプロイを実現し、効率を高め、プロセスを簡素化します。

迅速なアプリケーションアップデート

Capgoのアップデートパフォーマンスは驚くほど優秀です:

95%のアクティブユーザー 24時間以内にアップデートを受け取る
82%の成功率 世界中でアップデートを配信する
平均APIの応答時間は 世界中で434ms.

プラットフォームは部分アップデートを使用し、変更のみをダウンロードします。このアプローチにより、帯域幅の使用量が減り、更新プロセスが高速化されます。さらに、ビルド全体のプロセスは完全に自動化され、時間と労力が節約されます。

ビルド自動化

Capgo は主なCI/CDプラットフォームと組み合わせて、さまざまな統合を提供します:

CI/CDプラットフォーム	統合機能	利点
GitHub アクション	自動ビルド、デプロイトリガー	継続的なデプロイ
GitLab CI	パイプライン自動化、バージョン管理	フローを簡素化
Jenkins	カスタムワークフロー、ビルドハック	企業向けに拡張可能

自動ビルドの設定は通常、 1 か月あたり 300 ドル従来のソリューションと比較すると、 1 年あたり 6,000 ドル.

セキュリティ基準

Capgoは、以下のセキュリティ機能を備えています。

アップデートパッケージのエンドツーワンエンCRYPTION
セキュアなキー管理
Apple と Google のガイドラインへの準拠

バージョン管理機能

即時ロールバック機能。
デプロイメントバージョン管理。
ステージングリリース用のアップデートチャンネル管理。

このセキュリティフレームワークは、数百の企業アプリケーションを通じて徹底的にテストされています。追加のセキュリティが必要なチームには、Capgoも自社ホストのソリューションを提供し、カスタマイズ可能な構成を提供します。

Capgoのチャンネルシステムは、更新の配布を柔軟にします。開発者は、特定のユーザーグループに異なるバージョンをターゲットにし、ベータテストや段階的なロールアウトに適したものです。

概要

ビルドステップの概要

カスタムビルドスクリプトは、ビルドホック、環境変数、プラットフォーム固有のコマンドを利用して、自動化されたおよび一貫したデプロイメントを実現します。これらのプロセスは、Capgoを利用したデプロイメントの改善の基盤を形成します。

Capgoの利点

Capgoはデプロイメントを簡素化し、750のプロダクションアプリケーションを通じて成功した23.5百万の更新を配信しました。 [1]部分的な更新システムは、帯域幅使用量とデプロイメント時間を削減します。

プラットフォームは、高速な更新、グローバルパフォーマンスの最適化、端末間の暗号化を提供し、柔軟なチャンネルベースの配布システムを提供します。この設定は、ターゲットアップデート、ベータテスト、アプリストアのガイドラインへの準拠に適し、強力なセキュリティフレームワークを維持します。

Capgoから続きましょう: Capacitor CLI

Capgoを使用している場合 How to Customize Build Scripts with Capacitor CLI Capgo CI/CD Capgo CI/CD for the product workflow in Capgo CI/CD, Capgo Native Builds for the product workflow in Capgo Native Builds, Capgo Integrations for the product workflow in Capgo Integrations, Capgo CI/CD統合の実装詳細について CI/CD統合の実装詳細について GitHub アクション統合 GitHub アクション統合の実装詳細について。