アプリ マニフェストをカスタマイズする

  • [アーティクル]

アプリ マニフェスト (以前は Teams アプリ マニフェスト) では、アプリをMicrosoft Teamsに統合する方法について説明します。 スキャフォールディング後、既定のアプリ マニフェスト ファイルは で appPackage/manifest.json使用できます。 アプリ マニフェスト ファイルには、 の形式を持つ環境変数がいくつか含まれており、実際の ${{XX_XX}}値は、 や などの env/.env.devenv/.env.localenv ファイルMicrosoft Teams Toolkit を使用して解決されます。

実際のコンテンツでアプリ マニフェストをプレビューするために、Teams Toolkit は、次のフォルダー構造に示すように、フォルダーの下 appPackage/build にプレビュー アプリ マニフェスト ファイルを生成します。

└───appPackage
    └───build
        ├───appPackage.{env}.zip - Zipped app package of remote Teams app
        ├───appPackage.local.zip - Zipped app package of local Teams app
        ├───manifest.{env}.json  - Previewed manifest of remote Teams app
        └───manifest.local.json  - Previewed manifest of local Teams app

アプリ マニフェスト ファイルは、ローカル環境とリモート環境でプレビューできます。

ローカル環境でアプリ マニフェスト ファイルをプレビューする

ローカル環境でアプリ マニフェスト ファイルをプレビューするには、F5 キーを選択してローカル デバッグを実行します。 で env/.env.local環境変数を生成すると、アプリ パッケージとプレビュー アプリ マニフェストがフォルダーの下に appPackage/build 構築されます。

また、ツリー ビューまたは Teams から Zip Teams アプリ パッケージ をトリガーすることも、コマンド パレットから Zip Teams アプリ パッケージ をトリガーして、プレビュー アプリ マニフェストとアプリ パッケージを生成することもできます。

Zip Teams アプリ パッケージの選択を示すスクリーンショット。

リモート環境でアプリ マニフェスト ファイルをプレビューする

リモート環境でアプリ マニフェスト ファイルをプレビューするには、ツリー ビューから プロビジョニング をトリガーするか、コマンド パレットから Teams: プロビジョニング をトリガーできます。 これは、リモート Teams アプリの環境変数を生成し、アプリ パッケージをビルドし、プレビュー アプリ マニフェストをフォルダーの下に appPackage/build 生成します。

また、ツリー ビューまたは Teams から Zip Teams アプリ パッケージ をトリガーすることも、コマンド パレットから Zip Teams アプリ パッケージ をトリガーして、プレビュー アプリ マニフェストとアプリ パッケージを生成することもできます。

Teams アプリ パッケージを圧縮するオプションを示すスクリーンショット。

Visual Studio Code でアプリ マニフェストをカスタマイズする

ローカルデバッグまたはプロビジョニング中に、Teams Toolkit は からアプリ マニフェストを appPackage/manifest.json 読み込み、 で env/.env.xx定義された環境変数によってアプリ マニフェストを解決し、 Teams 用開発者ポータルで Teams アプリを作成または更新します。

  1. および teamsapp.local.ymlで独自のmanifest.json ファイルをteamsapp.yml定義できます。 たとえば、manifest.json ファイルを に test/test.json配置し、yaml ファイルのパラメーターを manifestPath 更新できます。

    - uses: teamsApp/zipAppPackage # Build Teams app package with latest env value
  with:
  manifestPath: ./test/test.json # Path to manifest template
  outputZipPath: ./appPackage/build/appPackage.${{TEAMSFX_ENV}}.zip
  outputJsonPath: ./appPackage/build/manifest.${{TEAMSFX_ENV}}.json

  2. 独自の環境変数を定義できます。 既定のmanifest.jsonには、${{xx_xx}} の形式のプレースホルダーがいくつか含まれています。 独自の環境変数を定義し、manifest.json ファイルにプレースホルダーを追加できます。 たとえば、env/.env.xx ファイルに新しい環境変数を定義してアプリの説明をカスタマイズし、対応するプレースホルダーでmanifest.jsonを更新できます。

    .env.dev

    TEAMS_APP_DESCRIPTION=This is an amazing app

    manifest.json

     {
     "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.17/MicrosoftTeams.schema.json",
     "manifestVersion": "1.17",
     "description": {
         "short": "${{TEAMS_APP_DESCRIPTION}}",
         "full": "Full description of tab0418"
     },
 }

  3. Teams Toolkit 5.10 以降では、 関数を file 使用して、長いアプリの説明や複数行のアプリの説明などのフィールドの値を別のテキスト ファイルに格納できます。 たとえば、 の親フォルダーmanifest.jsonにファイルを作成description.txtして、アプリの完全な説明を格納します。 次に、 のdescription.fullmanifest.json値を として$[file('description.txt')]設定します。 Teams Toolkit は、テキスト ファイルからコンテンツを読み取り、アプリ パッケージをビルドするときに完全な説明として使用します。

    description.txt

     This is the full description.

    manifest.json

     {
     "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.17/MicrosoftTeams.schema.json",
     "manifestVersion": "1.17",
     "description": {
         "short": "Short description of tab",
         "full": "$[file('./description.txt')]"
     },
 }

    でファイル パス env/.env.xxを追加することもできます。 次に、 の file() パラメーターを形式のプレースホルダーに ${{xx_xx}} 変更します。

    .env.dev

     DESCRIPTION_PATH=./description.txt

    manifest.json

    {
    "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.17/MicrosoftTeams.schema.json",
    "manifestVersion": "1.17",
    "description": {
        "short": "Short description of tab",
        "full": "$[file(${{DESCRIPTION_PATH}})]"
    },
}

アプリを検証する

カスタマイズ後に、アプリ マニフェストまたはアプリ パッケージを検証できます。 ツリー ビューから [アプリケーションの検証] をトリガーするか、コマンド パレットから [Teams: アプリケーションの検証] を トリガーできます。 マニフェスト スキーマを使用して検証するか、検証規則を使用してアプリ パッケージを検証するかの 2 つのオプションがあります。

ユーティリティの下の検証アプリケーションの選択を示すスクリーンショット。

アプリ マニフェスト スキーマを使用して検証する

このオプションは環境変数 appPackage/manifest.json を使用してレンダリングし、そのスキーマを使用してアプリ マニフェストを検証します。

マニフェスト スキーマを使用した検証の選択を示すスクリーンショット。

または、次のMicrosoft Teams Toolkit コマンド ライン インターフェイス (Teams Toolkit CLI) コマンドを使用します。

teamsfx validate --manifest-path <YOUR-PATH-TO-MANIFEST>

を満たしている MissingEnvironmentVariablesError場合は、Teams Toolkit がmanifest.jsonで定義されている対応する環境変数を見つけることができないことを意味します。 プロビジョニングを実行するか、F5 を選択して環境変数を生成するか、値を満たすためにファイルを手動で更新.env.xxする必要があります。

不足している環境変数エラーを示すスクリーンショット。

検証規則を使用してアプリ パッケージを検証する

このオプションは、検証規則を使用して zip 形式のアプリ パッケージを検証します。

検証ルールを使用したアプリ パッケージの検証の選択を示すスクリーンショット。

または、次の Teams Toolkit CLI コマンドを使用します。

teamsfx validate --app-package-file-path <YOUR-PATH-TO-APP-PACKAGE>

アプリ マニフェスト スキーマ以外の検証規則があります。 たとえば、静的タブ セクションに entityId conversations と名前がある場合、次のエラーが表示されます。

検証の出力を示すスクリーンショット。

Teams アプリを更新する

アプリ マニフェスト ファイルをプレビューして検証したら、コマンド パレットから Teams : Update Teams App コマンドをトリガーすることで、ローカルの変更を Teams 開発者ポータルに同期できます。

Teams 更新チーム アプリの選択を示すスクリーンショット。

または、次の Teams Toolkit CLI コマンドを使用します。

teamsfx update teams-app

注:

  • 変更は開発者ポータルに反映されます。 開発者ポータルの手動更新は上書きされます。
  • 発行されたアプリの名前を変更するには、 と manifest.json ファイルの両方を変更するlocal.manifest必要があります。

構成ファイルの変更またはテンプレートの変更が原因でアプリ マニフェスト ファイルが古くなっている場合は、次のいずれかのアクションを選択します。

  • プレビューのみ: ローカル アプリ マニフェスト ファイルは、現在の構成に従って上書きされます。
  • プレビューと更新: ローカル アプリ マニフェスト ファイルは現在の構成に従って上書きされ、Teams プラットフォームにも更新されます。
  • キャンセル: アクションは実行されません。

ローカル環境と開発環境の値をプレビューするには

でappPackage/manifest.json、CodeLens に移動して、および dev 環境の値をlocalプレビューできます。

CodeLens v5 を示すスクリーンショット。

注:

環境をプロビジョニングするか、ローカル デバッグを実行して環境変数を生成します。

[CodeLens] を選択すると、ファイルに .env 移動できます。これにより、すべての環境名がドロップダウン リストに表示されます。 環境を選択すると、対応する .env ファイルが開きます。

開発環境の選択を示すスクリーンショット。

すべての環境の値をプレビューするには、プレースホルダーにカーソルを合わせます。 環境名と対応する値の一覧が表示されます。 環境をプロビジョニングしなかった場合やローカル デバッグを実行しなかった場合は、環境変数が存在しない可能性があります。 プレースホルダー値を表示するには、アプリをローカルでプロビジョニングまたはデバッグします。

マウス ポインターを合わせると、環境名と対応する値を含むリストが表示されるプレースホルダーを示すスクリーンショット。

関連項目