Erweiterungsbeispiele

  • Artikel

Azure DevOps Services | Azure DevOps Server 2022 | Azure DevOps Server 2019

Beginnen Sie mit der Entwicklung Ihrer Erweiterung, indem Sie aus einem Beispiel arbeiten.

Tipp

Sehen Sie sich unsere neueste Dokumentation zur Erweiterungsentwicklung mithilfe des Azure DevOps-Erweiterungs-SDK an.

Die folgenden Microsoft-Beispiele zeigen die Funktionen des Erweiterungsframeworks und zeigen, wie Sie zu verschiedenen Bereichen beitragen. Jedes Beispiel veranschaulicht einen oder mehrere Beiträge. Wir beschränken die Anzahl der Beiträge für jedes Beispiel, um das Verständnis des Erweiterungsframeworks zu erhöhen.

Beispiel Quelle Beiträge Beschreibung
BreadcrumbService GitHub Breadcrumb Service, Hub Fügt einen Breadcrumb-Dienst hinzu, der dem Beispielhub ein "Sample Breadcrumb Item" hinzufügt. Um dieses Element anzuzeigen, wechseln Sie in der Pipelines-Hubgruppe zum Beispielhub.
CodeEditorContribution GitHub Code-Editor Fügt eine Sprachdefinition und ein JSON-Schema für den Code-Editor hinzu.
Feature GitHub Feature, Hub, Eigenschaftenanbieter Zeigt, wie Sie im Benutzerprofilmenü in den Bereich "Vorschaufeatures " eingebunden werden. Fügt einen einfachen Hub hinzu, der nur angezeigt wird, wenn Sie ein "ABC"-Feature aktivieren. Sie können das Feature ein- und ausschalten, pro Benutzer oder pro Organisation.
Hub GitHub Hub Fügt der Pipelines-Hubgruppe einen Hub mit dem Namen "Sample Hub" hinzu. Der Beispielhub befindet sich auf einer Seite auf Projektebene unter dem Navigationselement "Pipelines ".
Menü GitHub Menüelement "Builddefinition" Fügt dem Builds-Hub im Dropdownaktionenmenü ein Menüelement "Beispielbuilddefinition" hinzu. Der Menühandler ruft die aktuelle Builddefinition aus dem übergebenen Kontext ab, führt einen REST-Aufruf aus und zeigt dann das Ergebnis in einem Meldungsfeld an.
Panel GitHub Panelinhalt, Hub Im Hub-Beispiel angewendet. Enthält eine Umschaltfläche zusammen mit den Schaltflächen "OK " und "Abbrechen ". Kann als benutzerdefinierter Bereichs- oder Dialoginhalt verwendet werden.
Pivotieren GitHub Webregisterkarte Fügt der Startseite der Organisation oder Projektsammlung neben "Projekte", "Meine Arbeitsaufgaben" und "Meine Pullanforderungen" eine Pivot-Registerkarte "Beispiel" hinzu.
Ovale Steuerelemente GitHub Pillenanbieter Fügt Dem Titel der Pipelinedefinitionsseite (Runs) Pillen hinzu.
QueryParamsHandler GitHub Ereignisabonnement Fügt einen Dienst hinzu, der auf jeder Seite geladen wird, wenn ein showMyPanel Abfrageparameter in der URL angezeigt wird, wenn eine Seite geladen wird. Der Startdienst zeigt den benutzerdefinierten Bereich aus dem Panelbeispiel unter Verwendung eines optionalen myPanelTitle Abfrageparameters als Paneltitel an.
RepositoryActions GitHub Menübefehl Es fügt der Repositoryauswahl in der Kopfzeile der Codehubseiten ein Aktionsmenüelement für ein Beispiel-Repository hinzu. Wenn die href Eigenschaft angezeigt wird, wählen Sie die Aktion aus, um zur angegebenen URL zu wechseln. Wenn die Eigenschaft bereitgestellt wird, wird dieser uri Code ausgeführt, wenn Sie die Aktion auswählen.
RepositoryServiceHub GitHub Hub Fügt der Code-Hubgruppe einen Repositoryinformationshub hinzu. Veranschaulicht, wie Sie mit dem IVersionControlRepositoryService Repository eines Benutzers interagieren, um grundlegende Informationen zum Git-Repository eines Benutzers zu erhalten.
WorkItemFormGroup GitHub Arbeitsaufgabenformulargruppe Fügt dem Arbeitselementformular eine Erweiterung der WorkItem-Formulargruppe hinzu, um zu zeigen, wie mit dem IWorkItemFormService Dienst und IWorkItemNotificationListenerdem Dienst interagieren. Stellt eine Benutzeroberfläche bereit, um zu zeigen, wie Feldwerte mithilfe des Formulardiensts geändert und Arbeitsaufgabenformularbenachrichtigungsereignisse angezeigt werden.
WorkItemOpen GitHub Hub Fügt der Boards-Hubgruppe einen "Sample WorkItem Open"-Hub hinzu, um die Interaktion mit dem IWorkItemFormNavigationService Dienst zu zeigen. Stellt eine Benutzeroberfläche bereit, mit der Sie eine vorhandene Arbeitsaufgabe nach ID öffnen oder das Arbeitsaufgabenformular für eine neue Arbeitsaufgabe nach Arbeitsaufgabentyp öffnen können. Eine dieser Optionen öffnet ein Dialogfeld im Hostframe.
Benutzerdefiniertes Steuerelement für Arbeitsaufgaben in Farbskalen GitHub Formularsteuerelement für Arbeitsaufgaben Fügt den Werten in einer Dropdownliste Farbcodierung hinzu.
Ordnerverwaltung GitHub Kontextmenüaktion (Code-Explorer-Struktur) Erstellt einen Ordner in Ihren Quellrepositorys aus der Code-Explorer-Struktur. Sie müssen das Repository nicht klonen oder zusätzliche Tools installieren.
Offlinetestausführung GitHub Registerkarte "Plan testen" Ermöglicht es dem Tester, die Testschritte auszuführen, auch wenn die Verbindung mit Azure DevOps getrennt wurde. Dies kann mithilfe der exportierten Excel-Kalkulationstabelle erfolgen.
Release Management Utility-Aufgaben GitHub Freigeben von Verwaltungsaufgaben Hilfsaufgaben für die Versionsverwaltung.
Roll-up-Board GitHub Dashboard-Widget Zeigt die Anzahl der Karte in jeder Spalte des Kanban-Boards an.
Zustandsmodellvisualisierung GitHub Symbolleistenaktion (Arbeitsaufgabe), Hub Visualisieren Sie das Zustandsmodell für einen ausgewählten Arbeitsaufgabentyp.
Teamkalender GitHub Hub, Ereignisquellen Verfolgen Sie ereignisse, die für Ihr Team wichtig sind, anzeigen und verwalten Sie Tage, sehen Sie schnell, wann Sprints beginnen und enden, und vieles mehr.
Teamprojektintegrität GitHub Dashboard-Widget Ermöglicht Es Benutzern, die allgemeine Integrität von Builds zu visualisieren und einen visuellen Hinweis ähnlich dem Codify Build Light zu liefern.
WSJF (gewichteter kürzester Auftrag zuerst) GitHub Benachrichtigung (Arbeitsaufgabe), Kontextmenüaktion (Arbeitsaufgabe) Automatisch berechnet WSJF (gewichtet kürzester Auftrag zuerst) pro Arbeitsaufgabe und speichert ihn in einem Arbeitsaufgabenfeld.
Kaskadierende Listen GitHub Arbeitselementformular Definieren Sie kaskadierendes Verhalten für Auswahllisten im Arbeitsaufgabenformular.

Erste Schritte

Um so schnell wie möglich zu beginnen, verwenden Sie das Seedprojekt , das die zum Erstellen einer Erweiterung erforderlichen Dateien mit TypeScript enthält. Es gibt ein grunt skript zum Automatisieren des Erstellens, Verpackens und Veröffentlichens der Erweiterung.