Power Apps コンポーネントのツール

完了

Power Apps コード コンポーネントを構築する際は、ツールを組み合わせて、必要な最初の手順から最後の手順までを効率化します。

手順 説明 ツール
作成 テンプレートを使用して、コンポーネント プロジェクトを作成し、初期化します。 Power Platform コマンド ライン インターフェイス (CLI)
実装 コンポーネントの動作とスタイル設定を説明し、実装します。 任意のコード エディターまたは統合開発環境 (IDE)
ビルド TypeScript コードを検証してトランスパイルし、コンポーネント マニフェストをカスタマイズします。 Power Platform CLI または Visual Studio Code
デバッグ Dataverse 環境に配置せずに、コンポーネントの動作を検証し、トラブルシューティングを行います。 Power Platform CLI
パッケージ Dataverse ソリューション ファイルを作成し、そのソリューションの一部としてコンポーネントをパッケージ化します。 Power Platform CLI および Visual Studio msbuild

使用するいくつかのツールを見てみしましょう。

Power Platform CLI

Power Platform CLI (コマンド ライン インターフェイス) は、開発者向けのコマンド ライン ツールで、カスタム コードを作成するためのコマンドを提供します。 このツールには、現在コード コンポーネントとプラグインが含まれています。また、環境の管理に使用できる、環境管理者コマンドも用意されています。 solution コマンドと package コマンドを使用して、ソリューションでアプリケーション ライフサイクル管理を実装することもできます。

CLI は、少ない手順でインストールすることができます。 次の更新コマンドを使用して、バージョンが最新のものであることを確認できます。

pac install latest

コード コンポーネントの構築を開始する際は、CLI を使用して、テンプレートを使用した初期ファイルを作成します。 次のコマンドは、フィールド テンプレートを使用してコンポーネントを初期化する例です。

pac pcf init --namespace Contoso --name Slider --template field

CLI をインストールするために事前に行う手順の 1 つは、依存関係を管理してコード コンポーネントを構築するために使用するノード パッケージ マネージャー (npm) をインストールすることです。 init コマンドを使用すると、コード コンポーネントの依存関係が設定された package.json ファイルや、コンポーネントの開発に使用するビルド コマンドのようないくつかのコマンドが作成されます。 コンポーネントを初期化した後に最初に実行する npm コマンドは install です。 このコマンドによって、Power Apps Component Framework をサポートするために必要なすべてのライブラリがダウンロードされます。

npm install

init コマンドのオプションに --run-npm-install を追加することで、初期化の実行時に npm のインストールも実行するように要求することもできます。

pac pcf init --namespace Contoso --name Slider --template field --run-npm-install

コード コンポーネントを開発する際は、次のビルド コマンドを使用して、コードの問題を確認することができます。

npm run build

このコマンドによってマニフェストを検証し、TypeScript トランスパイラーを実行して、問題を検出することができます。

テスト ハーネスを使用して、環境に展開することなく、コード コンポーネントをローカルでテストすることもできます。 次の開始コマンドを使用して、コード コンポーネントのテスト ハーネスを起動できます。

npm start

npm start watch コマンドを使用して、ウォッチ モードを有効にすることもできます。 ウォッチ モードでコードに変更を加える場合、テスト ハーネスは再起動することなく自動的に変更が適用されます。

コード コンポーネントのテストを迅速化するために、CLI は開発環境を認証し、実際のアプリでテストできるよう、コード コンポーネントをプッシュします。 次のコマンドは、コード コンポーネントの最新バージョンをビルドし、現在構成されている Dataverse 開発環境にプッシュします。

pac pcf push --publisher-prefix dev

Visual Studio Code 向けのツール

Visual Studio Code 用の Power Platform 拡張機能をインストールすると、エディター環境のコンテキスト内で機能する Power Platform コマンド ライン インターフェイス (CLI) が追加されます。 拡張機能は、Visual Studio Marketplace からインストールできます。 インストールしたら、ターミナル ウィンドウから CLI pac コマンドを使用できます。

Visual Studio 向けのツール

これらのツールは、スタンドアロンのインストールを使用して、または Visual Studio インストールの一部としてインストールすることができます。 これらのツールは、Windows および Mac 用に、ダウンロード の Visual Studio 2022 のセクションからダウンロードできます。

msbuild コマンドは、Dataverse 環境に展開する Power Apps ソリューションの一部として、コンポーネントをパッケージ化する際に使用します。 たとえば、次のコマンドは、コンポーネントの新しいソリューションを初期化して、ビルド中に出力ソリューション ファイルの作成を管理する msbuild プロジェクト ファイルを作成します。

pac solution init --publisher-name Contoso --publisher-prefix contoso ‑‑outputDirectory vssolution

コード コンポーネントをソリューションにパッケージ化するには、コンポーネントへの参照を追加する必要があります。 こうすることで、ビルドの実行時に、生成される出力ソリューションにコンポーネントを確実に含めることができます。 次のコマンドで、参照を追加することができます。

pac solution add-reference --path \<path to your Power Apps component framework project\>

msbuild コマンドを使用して、ソリューション参照を構成したソリューション ファイルを生成できます。 次のコマンドで最初のビルドが実行されます。

msbuild /t:build /restore

ヒント

msbuild コマンドが認識できないというエラーが表示される場合、Visual Studio の開発者コマンド プロンプトからコマンドを実行してみてください。 このショートカットは、Visual Studio の一部として、または Tools for Visual Studio のインストールの一部として作成されます。

最初のビルドが完了したら、msbuild コマンドを実行して、ソリューション ファイルを再生成できます。 生成されたソリューション ファイルは、ビルドが正常に実行された後、\bin\debug\ (または \bin\release) フォルダーに格納されます。 出力 ZIP ファイルの準備ができたら、手動で Dataverse にソリューションをインポートするか、Microsoft Power Platform Build Tools を使用して自動的に展開することができます。

IDE の選択

Visual Studio Code または Visual Studio を使用してコンポーネントを作成することをお勧めします。 しかし、カスタムの Power Apps コード コンポーネントを作成するには、どの IDE を使用してもかまいません。