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 haben die Anzahl der Beiträge für jedes Beispiel eingeschränkt, um das Verständnis des Erweiterungsframeworks zu erhöhen.

Beispiel Quelle Beiträge Beschreibung
BreadcrumbService GitHub Breadcrumb Service, Hub Es fügt einen Breadcrumb-Dienst hinzu, der dem Beispielhub ein "Sample Breadcrumb Item" hinzufügt. Besuchen Sie den "Sample Hub" in der Pipelines-Hubgruppe, um dieses Element anzuzeigen.
CodeEditorContribution GitHub Code-Editor Sie fügt eine Sprachdefinition und ein JSON-Schema für den Code-Editor hinzu.
Feature GitHub Feature, Hub, Eigenschaftenanbieter Es zeigt, wie Sie in den Bereich "Vorschaufeatures" (unter dem Benutzerprofilmenü) eingebunden werden. Sie fügt einen einfachen Hub hinzu, der nur angezeigt wird, wenn ein "ABC"-Feature aktiviert ist. Das Feature kann pro Benutzer oder pro Organisation umgeschaltet werden.
Hub GitHub Hub Er fügt der Hubgruppe einen Hub mit dem Pipelines Namen "Sample Hub" hinzu. Wenn Sie eine Seite auf Projektebene besuchen, finden Sie "Sample Hub" unter dem Pipelines Navigationselement im vertikalen Navigationsmenü auf der linken Seite.
Menü GitHub Menüelement "Builddefinition" Es fügt dem Builds Hub im Dropdownaktionenmenü oben rechts auf der Seite ein Menüelement "Beispielbuilddefinition" hinzu. Der Menühandler ruft die aktuelle Builddefinition aus dem Kontext ab, der an ihn übergeben wird, erstellt einen REST-Aufruf und zeigt das Ergebnis in einem Meldungsfeld an.
Panel GitHub Panelinhalt, Hub Sie wird innerhalb des Hub Beispiels genutzt. Es handelt sich um Inhalte, die eine Umschaltfläche zusammen mit den Schaltflächen "OK/Abbrechen" enthalten. Sie kann als benutzerdefinierter Bereichs- oder Dialoginhalt verwendet werden.
Pivotieren GitHub Webregisterkarte Sie fügt der Startseite "Organisation (Project Collection)" neben "Projekte", "Meine Arbeitsaufgaben" und "Meine Pullanforderungen" ein Pivot -Pivot (Registerkarte) hinzu.
Pillen GitHub Pillenanbieter Es fügt Pillen zum Titel der Pipelinedefinitionsseite (Runs) hinzu.
QueryParamsHandler GitHub Ereignisabonnement Er fügt einen Dienst hinzu, der auf jeder Seite geladen wird, wenn ein Abfrageparameter "showMyPanel" in der URL vorhanden ist, wenn eine Seite geladen wird. Der Startdienst zeigt den benutzerdefinierten Bereich aus dem Panelbeispiel mit einem optionalen "myPanelTitle"-Abfrageparameter als Paneltitel an.
RepositoryActions GitHub Menübefehl Es fügt der Repositoryauswahl in der Kopfzeile der Codehubseiten ein Menüelement "Beispiel-Repositoryaktion" hinzu. Wenn eine href Eigenschaft angegeben wird, navigiert das Klicken auf die Aktion zur angegebenen URL. Wenn ein uri Code angegeben wird, wird dieser Code ausgeführt, wenn auf die Aktion geklickt wird.
RepositoryServiceHub GitHub Hub Der Hubgruppe wird ein Hub Code "Repositoryinformationen" hinzugefügt. Es veranschaulicht, wie sie mit dem IVersionControlRepositoryService Abrufen grundlegender Informationen über das aktuell ausgewählte Git-Repository eines Benutzers interagieren.
WorkItemFormGroup GitHub Arbeitsaufgabenformulargruppe Es fügt eine Erweiterung "Sample WorkItem Form Group" zum Arbeitselementformular hinzu, um zu zeigen, wie mit dem IWorkItemFormService Dienst und IWorkItemNotificationListener. Auf der Benutzeroberfläche wird gezeigt, wie Feldwerte mithilfe des Formulardiensts geändert und Benachrichtigungsereignisse des Arbeitselementformulars angezeigt werden.
WorkItemOpen GitHub Hub Sie fügt der Boards-Hubgruppe einen Hub "Sample WorkItem Open" hinzu, um die Interaktion mit dem IWorkItemFormNavigationService Dienst zu zeigen. Die Benutzeroberfläche ermöglicht es Ihnen, eine vorhandene Arbeitsaufgabe (nach ID) zu öffnen oder das Arbeitsaufgabenformular für eine neue Arbeitsaufgabe (nach Arbeitsaufgabentyp) zu öffnen. Eine dieser Optionen öffnet ein Dialogfeld im Hostframe.
Benutzerdefiniertes Steuerelement für Arbeitsaufgaben in Farbskalen GitHub Formularsteuerelement für Arbeitsaufgaben Fügen Sie den Werten in einer Dropdownliste Farbcodierung hinzu.
Ordnerverwaltung GitHub Kontextmenüaktion (Code-Explorer-Struktur) Erstellen Sie 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 Dieses Widget zeigt die Anzahl der Karte in jeder Spalte des Kanban-Boards an.
Beispieldaten-Widget GitHub Dashboard-Widget Erstellen Sie Beispieldaten in Ihrem Team Services-Projekt.
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öglichen Sie 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

Damit Sie so schnell wie möglich beginnen können, steht ein Startprojekt zur Verfügung, das die zum Erstellen einer Erweiterung mit TypeScript erforderlichen Dateien enthält. Um das Erstellen, Verpacken und Veröffentlichen der Erweiterung zu automatisieren, wird ein grunt-Skript hinzugefügt.