次の方法で共有

Teams Toolkit を使用して Office アドイン プロジェクトを作成する

  • [アーティクル]

Teams アプリを開発するための主要なツールは、Teams Toolkit です。 Teams Toolkit を使用して Office アドインを作成できます。次の制限があります。

  • Teams Toolkit で作成されたアドインでは、 Microsoft 365 の統合マニフェストが使用されます。

  • 現時点では、Outlook アドインのみを作成できます。 Microsoft では、他の Office アプリケーションとプラットフォームへのアドインに対する Teams Toolkit のサポートを有効にするよう努力しています。

    注:

    Microsoft 365 の統合マニフェストを使用する Office アドインは、Office on the web、新しい Outlook on Windows、および Microsoft 365 サブスクリプションバージョン 2304 (ビルド 16320.00000) 以降に接続された Office on Windows で直接サポートされます。

    統合マニフェストを含むアプリ パッケージが AppSource または Microsoft 365 管理センター に展開されている場合、マニフェストに有効な "alternateIcons" プロパティがある場合、アドインのみのマニフェストが統合マニフェストから生成され、格納されます。 このアドイン専用マニフェストを使用すると、Office on Mac、Office on mobile、2304 より前の Office on Windows のサブスクリプション バージョン (ビルド 16320.00000)、および永続的なバージョンの Office on Windows など、統合マニフェストを直接サポートしていないプラットフォームにアドインをインストールできます。

「Teams Toolkit のインストール」の説明に従って、最新バージョンの Teams Toolkit を Visual Studio Code にインストールします。

Outlook アドイン プロジェクトを作成する

  1. Visual Studio Code を開き、 アクティビティ バーの [Teams ツールキット] アイコンを選択します。

    Teams ツールキット アイコン。

  2. [ 新しいアプリの作成] を選択します。

  3. [ 新しいプロジェクト ] ドロップダウンで、[ Outlook アドイン] を選択します。

    [新しいプロジェクト] ドロップダウンの 4 つのオプション。4 番目のオプションは

  4. [ Outlook アドインを使用したアプリ機能 ] ドロップダウンで、[ タスクペイン] を選択します。

    [Outlook アドインを使用したアプリ機能] ドロップダウンの 2 つのオプション。最初のオプション 'Taskpane' が選択されています。

  5. 開いた [ワークスペース フォルダー ] ダイアログで、プロジェクトを作成するフォルダーを選択します。

  6. プロンプトが表示されたら、プロジェクトに名前を付けます (スペースなし)。 Teams Toolkit は、基本的なファイルとスキャフォールディングを使用してプロジェクトを作成します。 次に、 2 番目の Visual Studio Code ウィンドウでプロジェクトを開きます。 元の Visual Studio Code ウィンドウを閉じます。

  7. Visual Studio Code TERMINAL で、プロジェクトのルートに移動し、 npm installを実行します。

  8. プロジェクトに変更を加える前に、Visual Studio Code から Outlook アドインをサイドロードできることを確認します。 次の手順を実行します。

    1. Microsoft 365 開発者テナントのアカウントが、デスクトップ Outlook のメール アカウントでもあることを確認します。 そうでない場合は、「 メール アカウントを Outlook に追加する」のガイダンスに従ってください。
    2. Outlook デスクトップを閉じます。
    3. Visual Studio Code で、Teams Toolkit を開きます。
    4. [ ACCOUNTS ] セクションで、Microsoft 365 にサインインしていることを確認します。
    5. Visual Studio Code で [表示 | Run] を 選択します。 [ 実行とデバッグ ] ドロップダウン メニューで、[ Outlook Desktop (Edge Chromium)] オプションを選択し、F5 キーを押します。 プロジェクトがビルドされ、Node dev-server ウィンドウが開きます。 このプロセスには数分かかる場合があります。 最終的に、Outlook デスクトップが開きます。
    6. Microsoft 365 アカウント ID の受信トレイを開き、任意のメッセージを開きます。 2 つのボタンを含む Contoso アドイン タブが [ホーム ] リボン (またはメッセージ リボン (独自のウィンドウで メッセージ を開いている場合) に表示されます。
    7. [ タスクウィンドウの表示 ] ボタンをクリックすると、作業ウィンドウが開きます。 [ アクションの実行 ] ボタンをクリックすると、メッセージの上部近くに小さな通知が表示されます。
    8. デバッグを停止してアドインをアンインストールするには、[Visual Studio Code で 実行 | Stop デバッグ ] を選択します。

これで、プロジェクトを変更して開発できます。 Office アドインドキュメントのガイダンスが、使用されているマニフェストの種類に応じて分岐する場所では、統合マニフェストのガイダンスに従ってください。