本文へスキップ
バージョン: v8

設定

ファイル​

設定値はJSONファイルに保存されます。Ionic CLIは、通常~/.ionic/config.jsonにあるグローバル設定ファイルと、通常プロジェクトのルートディレクトリにあるionic.config.jsonというプロジェクト設定ファイルを維持します。

CLIは、プロジェクト設定ファイルとグローバルCLI設定ファイルから設定値を設定および出力するためのコマンドを提供します。ionic config --helpを参照するか、ionic config getとionic config setの使用に関するドキュメントを参照してください。

プロジェクト設定ファイル​

各Ionicプロジェクトには、通常プロジェクトのルートディレクトリにあるプロジェクト設定ファイルがあります。以下は、注釈付きのionic.config.jsonファイルです。

{
  // The human-readable name of the app.
  "name": "My App",

  // The project type of the app. The CLI uses this value to determine which
  // commands and command options are available, what to output for help
  // documentation, and what to use for web asset builds and the dev server.
  "type": "angular",

  // The App ID for Appflow.
  "id": "abc123",

  // Configuration object for integrations such as Cordova and Capacitor.
  "integrations": {
    "cordova": {
      ...
    }
  },

  // Hook configuration--see the Hooks section below for details.
  "hooks": {
    ...
  }
}

環境変数​

CLIは、以下の環境変数を検索します。

  • IONIC_CONFIG_DIRECTORY: グローバルCLI設定のディレクトリ。デフォルトは~/.ionicです。
  • IONIC_HTTP_PROXY: すべてのCLIリクエストを介してプロキシするためのURLを設定します。プロキシの使用を参照してください。
  • IONIC_TOKEN: Appflowで自動的に認証します。

フラグ​

CLIフラグは、CLIコマンドの動作を変更するグローバルオプションです。

  • --help: コマンドを実行する代わりに、そのヘルプページを表示します。
  • --verbose: デバッグのためにすべてのログメッセージを表示します。
  • --quiet: WARNとERRORのログメッセージのみを表示します。
  • --no-interactive: インタラクティブなプロンプトと派手な出力をオフにします。CIまたは非TTYターミナルが検出されると、CLIは自動的に非インタラクティブになります。
  • --confirm: 確認プロンプトの自動確認をオンにします。注意：CLIは潜在的に有害な操作を行う前にプロンプトを表示します。自動確認は意図しない結果をもたらす可能性があります。

フック​

CLIは、ビルドの前後など、特定のイベント中にスクリプトを実行できます。CLIにフックするには、package.jsonで次のnpmスクリプトを使用できます。

  • ionic:serve:before: デブサーバーの起動前に実行されます。
  • ionic:serve:after: デブサーバーの終了後に実行されます。
  • ionic:build:before: ウェブアセットのビルド開始前に実行されます。
  • ionic:build:after: ウェブアセットのビルド完了後に実行されます。
  • ionic:capacitor:run:before: ionic capacitor run中に、capacitor openが実行される前に実行されます。
  • ionic:capacitor:build:before: ionic capacitor build中に、capacitor openが実行される前に実行されます。
  • ionic:capacitor:sync:after: ionic capacitor sync中に、同期後に実行されます。

フックにシェルスクリプトを使用する場合、フックコンテキストはIONIC_CLI_HOOK_CTX_で始まるプレフィックスの環境変数で定義されます。

以下の例は、ionic:capacitor:buildフックに設定される環境変数を示しています。

IONIC_CLI_HOOK_CTX_NAME=capacitor:build:before
IONIC_CLI_HOOK_CTX_BUILD_CORDOVA_ASSETS=true
IONIC_CLI_HOOK_CTX_BUILD_ENGINE=browser
IONIC_CLI_HOOK_CTX_BUILD_PROJECT=app
IONIC_CLI_HOOK_CTX_BUILD_TYPE=angular
IONIC_CLI_HOOK_CTX_BUILD_VERBOSE=false
IONIC_CLI_HOOK_CTX_CAPACITOR_APP_ID=io.ionic.starter
IONIC_CLI_HOOK_CTX_CAPACITOR_APP_NAME=ionic-starter-app
IONIC_CLI_HOOK_CTX_CAPACITOR_VERBOSE=false

フックはionic.config.jsonでも定義できます。プロジェクト内にhooksオブジェクトを定義します。各キーはフックの名前（ionic:プレフィックスなし）、値はJavaScriptファイルへのパスまたはパスの配列です。

以下の例では、ファイルがインポートされ、ionic:build:beforeフック中に実行されます。

"hooks": {
  "build:before": "./scripts/build-before.js"
},

JavaScriptフックファイルは、フックが実行されるたびに単一の引数（ctx）が渡される単一の関数をエクスポートする必要があります。

この引数は、フックファイルに与えられるコンテキストであり、フックによって、また呼び出しによって異なります。

./scripts/build-before.js:

module.exports = function (ctx) {
  console.log(ctx);
};

マルチアプリプロジェクト​

CLI 6.2.0以降で使用可能

Ionic CLIは、単一のレポジトリ内、またはモノレポ内に複数のIonicアプリと共有コードを含むマルチアプリ設定をサポートしています。

注記

これらのドキュメントでは、Ionic CLIのマルチアプリ機能の概要を示していますが、各フレームワークの詳細については説明していません。

Angularを使用している場合は、この記事で例を参照してください。

セットアップ手順​

  1. ディレクトリを作成し、モノレポを初期化します（詳細はプロジェクト構造を参照）。

  2. モノレポをIonicマルチアプリプロジェクトとして初期化します。これにより、マルチアプリionic.config.jsonファイルが作成されます。詳細は設定ファイルを参照してください。

    $ ionic init --multi-app

  3. ionic startを使用してIonicアプリを作成するか、ionic initを使用して既存のアプリを初期化します（詳細はアプリの追加を参照）。

プロジェクト構造​

マルチアプリプロジェクトでは、プロジェクト構造は柔軟です。唯一の要件は、リポジトリのルートにあるマルチアプリionic.config.jsonファイルです。

以下は、apps/ディレクトリ内のアプリがlib/ディレクトリ内の共有コードから分離されている例です。ルートionic.config.jsonファイルとモノレポのpackage.jsonファイルに注目してください。

apps/
├── myApp/
└── myOtherApp/
lib/
ionic.config.json
package.json

設定ファイル​

マルチアプリプロジェクトでは、各アプリが独自のファイルを持つのではなく、アプリはリポジトリのルートにある単一のionic.config.jsonファイルを共有します。マルチアプリ設定ファイルには、projectsオブジェクトに設定オブジェクトをネストすることで、各アプリの設定が含まれています。defaultProjectを使用してデフォルトアプリを指定できます。

以下は、上記のファイル構造に対応するファイルの例です。

{
  "defaultProject": "myApp",
  "projects": {
    "myApp": {
      "name": "My App",
      "integrations": {},
      "type": "angular",
      "root": "apps/myApp"
    },
    "myOtherApp": {
      "name": "My Other App",
      "integrations": {},
      "type": "angular",
      "root": "apps/myOtherApp"
    }
  }
}

マルチアプリプロジェクトが検出されると、Ionic CLIはルートionic.config.jsonに設定されているアプリのコンテキストで動作します。プロジェクトの選択基準は次のとおりです。

  1. グローバルCLIオプション--projectが指定されている場合、プロジェクトはprojectsオブジェクトのキーで検索されます。たとえば、--project=myAppはmyAppプロジェクトを選択します。
  2. CLIが、rootキーで設定されたプロジェクトパス内で実行されていることを検出した場合、一致するプロジェクトを選択します。たとえば、apps/myOtherApp/srcディレクトリ内でCLIを使用すると、myOtherAppプロジェクトが選択されます。
  3. ionic.config.jsonにdefaultProjectが指定されている場合、上記の基準を満たしていない場合に、指定されたプロジェクトが選択されます。

アプリの追加​

アプリは、ionic startを使用して新しいアプリを作成するか、ionic initを使用して既存のアプリを初期化することで、マルチアプリプロジェクトに登録できます。

ionic startの使用​

ionic start中にマルチアプリプロジェクトが検出されると、CLIはプロジェクト固有のファイルを作成する代わりに、アプリ設定をルートionic.config.jsonファイルに追加します。

依存関係のインストールは、依存関係がモノレポのルートにホイスティングされている場合は、--no-deps を使用してスキップできます。

$ cd apps/
$ ionic start "My New App" --no-deps

ionic init の使用​

アプリがionic start以外の方法（例えば、事前にビルドされたテンプレートを使用）で作成された場合は、ionic initを使用して既存のアプリをマルチアプリプロジェクトに登録します。

注記

アプリに既存のionic.config.jsonがないことを確認してください。

$ cd apps/existing-app/
$ ionic init

高度な設定​

ビルドのオーバーライド​

通常、CLIはプロジェクトの種類に基づいてハードコードされた一連のコマンドを実行します。たとえば、Angularプロジェクトの標準的なWebアセットビルドはng run app:buildです。ionic:build npm スクリプト を使用することで、Webアセットビルドをオーバーライドし、ionic buildを引き続き使用できます。同様に、ionic:serve npm スクリプトを使用して、開発サーバーをオーバーライドできます。

Ionic CLIによってスクリプトに渡されるフラグに注意してください。特にデバイスのリロードライブでは、オプションが尊重されない場合、不規則性が発生する可能性があります。

コマンドオプション​

コマンドオプションは環境変数で表現できます。通常は--opt=value構文で設定されます。これらの環境変数の命名は、IONIC_CMDOPTS_で始まり、コマンド名（スペースをアンダースコアに置き換え）、オプション名（ハイフンをアンダースコアに置き換え）、すべて大文字にするというパターンに従います。ブールフラグ（値を取らないコマンドラインオプション）は1または0に設定できます。存在する場合は、ブールフラグから--no-プレフィックスを取り除きます（例：ionic serveの--no-openはIONIC_CMDOPTS_SERVE_OPEN=0で表現できます）。

たとえば、ionic cordova run ios -lc --livereload-port=1234 --host=0.0.0.0のコマンドオプションは、この一連の環境変数でも表現できます。

$ export IONIC_CMDOPTS_CORDOVA_RUN_LIVERELOAD=1
$ export IONIC_CMDOPTS_CORDOVA_RUN_CONSOLELOGS=1
$ export IONIC_CMDOPTS_CORDOVA_RUN_LIVERELOAD_PORT=1234
$ export IONIC_CMDOPTS_CORDOVA_RUN_HOST=0.0.0.0

これらの変数が環境に設定されている場合、ionic cordova build iosはそのオプションの新しいデフォルトを使用します。

テレメトリ​

CLIは、より良いエクスペリエンスを作成するために、Ionicに利用状況データを送信します。この機能を無効にするには、ionic config set -g telemetry falseを実行します。

目次

このページを編集