Hinweis
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, sich anzumelden oder das Verzeichnis zu wechseln.
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, das Verzeichnis zu wechseln.
In diesem Abschnitt erfahren Sie, wie Sie mit Microsoft Visual Studio Code ein neues Microsoft Teams-Projekt erstellen.
Erstellen eines neuen Teams-Projekts mit Visual Studio Code
Sie können ein neues Teams-Projekt erstellen, indem Sie Im Microsoft 365 Agents Toolkit (früher als Teams-Toolkit bezeichnet) die Option Neuen Agent/neue App erstellen auswählen. Sie können mit integrierten Teams-App-Vorlagen beginnen oder mit offiziellen Teams-App-Beispielen im Agents Toolkit beginnen. Darüber hinaus unterstützt das Agents Toolkit, mit Outlook-Add-In-Vorlagen zu beginnen, um Ihre eigenen Outlook-Add-Ins zu erstellen.
Um mit den Teams-Funktionen zu beginnen, können Sie die folgenden Arten von Teams-Apps erstellen:
| App-Typen | Definition |
|---|---|
| Szenariobasierte Teams-Apps | Diese Gruppe von Vorlagen ist für bestimmte abstrahierte Geschäftsszenarien konzipiert, für die Ihre Teams-App verwendet werden kann. Beispiel: Benachrichtigungsbot, Befehlsbot, SSO-fähige Registerkarte oder Dashboard-Registerkarten-App. |
| Grundlegende Teams-Apps | Einfache Teams-Apps sind nur die Teams-Registerkarten, Bots oder Nachrichtenerweiterungen hello world, die Sie basierend auf Ihren Anforderungen erstellen und anpassen können. |
| Erweitern der Teams-App auf Microsoft 365 | Diese Gruppe von Teams-Apps kann in Outlook und Office.com installiert und ausgeführt werden. |
Erstellen einer neuen Teams-App
Der Prozess zum Erstellen einer neuen Teams-App ist für alle Arten von Apps ähnlich.
So erstellen Sie eine einfache Teams-App:
Öffnen Sie Visual Studio Code.
Wählen Sie microsoft 365 Agents Toolkit>Neuen Agent/neue App> erstellen und Teams-App aus.
Wählen Sie in diesem Beispiel tab als App-Funktion aus.
Wählen Sie die Registerkarte "Basic" als App-Funktion aus.
Wählen Sie JavaScript als Programmiersprache aus.
Wählen Sie Standardordner aus, um ihren Projektstammordner am Standardspeicherort zu speichern.
Erfahren Sie, wie Sie den Standardordner ändern:
Wählen Sie Durchsuchen aus.
Wählen Sie den Speicherort für den Projektarbeitsbereich aus.
Der ausgewählte Ordner ist der Speicherort für Ihren Projektarbeitsbereich.
- Geben Sie einen geeigneten Namen für Ihre App ein, z. B. helloworld, als Anwendungsnamen. Stellen Sie sicher, dass Sie nur alphanumerische Zeichen verwenden. Drücken Sie EINGABE.
Die Teams-Registerkarten-App wird in wenigen Sekunden erstellt.
Verzeichnisstruktur für verschiedene App-Typen
Agents Toolkit stellt alle Komponenten zum Erstellen einer App bereit. Nachdem Sie das Projekt erstellt haben, können Sie die Projektordner und Dateien im Explorer-Abschnitt anzeigen.
Verzeichnisstruktur für die einfache Teams-App
Das folgende Beispiel zeigt eine grundlegende Verzeichnisstruktur der Teams-Registerkarten-App:
| Ordnername | Inhalt |
|---|---|
.vscode |
Einstellungen für VS Code zum Erstellen und Debuggen Ihrer Teams-App. |
appPackage |
App-Manifestdateien (früher Teams-App-Manifest genannt) und Symboldateien, die Teams verwendet haben, um Ihre Teams-App zu erkennen. |
env |
Speichert verschiedene Umgebungsparameter. |
infra |
Azure-Vorlagendateien bicep . Wird zum Bereitstellen Ihrer Teams-App in Azure verwendet. |
src |
Quellcode für die Registerkartenfunktion, einschließlich Ihrer Front-End-App, Ui-Komponenten und der Datenschutzhinweis, Nutzungsbedingungen, |
src/app.js |
Anwendungseinstiegspunkt und express -handler für website. |
src/views/hello.html |
Eine HTML-Vorlage, die an den Registerkartenendpunkt gebunden wird. |
src/static |
Der Webserver kann statische Ressourcen wie CSS- und JavaScript-Dateien bereitstellen. |
m365agents.yml |
Diese Konfigurationsdatei definiert das Verhalten des Agents-Toolkits für den Bereitstellungs-, Bereitstellungs- und Veröffentlichungslebenszyklus. Sie können diese Datei anpassen, um das Verhalten des Agents Toolkits in jedem Lebenszyklus zu ändern. |
m365agents.local.yml |
Dadurch wird m365agents.yml mit Aktionen überschrieben, die die lokale Ausführung und das Debuggen ermöglichen. |
Hinweis
Wenn Sie über eine Bot- oder Nachrichtenerweiterungs-App verfügen, werden der Verzeichnisstruktur relevante Ordner hinzugefügt.
Weitere Informationen zur Verzeichnisstruktur verschiedener Typen grundlegender Teams-Apps finden Sie in der folgenden Tabelle:
| App-Typ | Links |
|---|---|
| Für Registerkarten-App | Erstellen Ihrer ersten Registerkarten-App mit JavaScript |
| Für Bot-App | Erstellen Ihrer ersten Bot-App mit JavaScript |
| Für Nachrichtenerweiterungs-App | Erstellen Ihrer ersten Nachrichtenerweiterungs-App mit JavaScript |
Verzeichnisstruktur für szenariobasierte Teams-App
Das folgende Beispiel zeigt eine szenariobasierte Verzeichnisstruktur des Benachrichtigungsbots Teams-App:
Der neue Projektordner enthält den folgenden Inhalt:
| Ordnername | Inhalt |
|---|---|
.vscode |
Einstellungen für VS Code zum Erstellen und Debuggen Ihrer Teams-App. |
appPackage |
Die App-Manifestdatei und Symboldateien, die Teams verwendet haben, um Ihre Teams-App zu erkennen. |
env |
Speichert verschiedene Umgebungsparameter. |
infra |
Azure-Vorlagendateien bicep . Wird zum Bereitstellen Ihrer Teams-App in Azure verwendet. |
m365agents.yml |
Diese Konfigurationsdatei definiert das Verhalten des Agents-Toolkits für den Bereitstellungs-, Bereitstellungs- und Veröffentlichungslebenszyklus. Sie können diese Datei anpassen, um das Verhalten des Agents Toolkits in jedem Lebenszyklus zu ändern. |
m365agents.local.yml |
Dadurch wird m365agents.yml mit Aktionen überschrieben, die die lokale Ausführung und das Debuggen ermöglichen. |
Die Kernbenachrichtigungsimplementierung wird im Ordner src gespeichert und enthält Folgendes:
| Dateiname | Inhalt |
|---|---|
src\adaptiveCards\ |
Vorlagen für adaptive Karten. |
src\internal\ |
Generierter Initialisierungscode für die Benachrichtigungsfunktionalität. |
src\index.ts |
Der Einstiegspunkt zum Verarbeiten von Botnachrichten und Senden von Benachrichtigungen. |
.gitignore |
Datei zum Ausschließen lokaler Dateien aus dem Botprojekt. |
package.json |
Die npm-Paketdatei für das Botprojekt. |
Hinweis
Wenn Sie über einen Befehlsbot, einen Workflowbot, eine SSO-fähige Registerkarte oder eine SPFx-Registerkarten-App verfügen, werden der Verzeichnisstruktur relevante Ordner hinzugefügt.
Weitere Informationen zur Verzeichnisstruktur verschiedener Typen von szenariobasierten Teams-Apps finden Sie in der folgenden Tabelle:
| App-Typ | Links |
|---|---|
| Für Benachrichtigungsbot-App | Benachrichtigung an Teams senden |
| Für Befehlsbot-App | Befehlsbot erstellen |
| Für Workflowbot-App | Erstellen eines Teams-Workflowbots |
| Für SPFx-Registerkarten-App | Erstellen einer Teams-App mit SPFx |
Siehe auch
Zusammenarbeit auf GitHub
Die Quelle für diesen Inhalt finden Sie auf GitHub, wo Sie auch Issues und Pull Requests erstellen und überprüfen können. Weitere Informationen finden Sie in unserem Leitfaden für Mitwirkende.