Ejemplos de extensiones

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

Empiece a desarrollar la extensión trabajando desde un ejemplo.

Sugerencia

Consulte nuestra documentación más reciente sobre el desarrollo de extensiones mediante el SDK de extensión de Azure DevOps.

En los siguientes ejemplos de Microsoft se muestran las funcionalidades del marco de extensión y cómo contribuir a varias áreas. Cada ejemplo muestra una o varias contribuciones. Hemos limitado el número de contribuciones de cada ejemplo para aumentar la comprensión del marco de extensión.

Ejemplo Source Contribuciones Descripción
Ruta de navegaciónService GitHub Servicio de ruta de navegación, concentrador Agrega un servicio de ruta de navegación que agrega un "Elemento de ruta de navegación de ejemplo" al centro de ejemplo. Visite el "Centro de ejemplo" en el grupo concentrador de canalizaciones para ver este elemento.
CodeEditorContribution GitHub Editor de código Agrega una definición de lenguaje y un esquema JSON para el editor de código.
Característica GitHub Feature, Hub, Property Provider Muestra cómo enlazar al panel Características de vista previa (en el menú perfil de usuario). Agrega un concentrador simple que solo se muestra cuando se activa una característica "ABC". La característica se puede alternar por usuario o por organización.
Hub GitHub Hub Agrega un centro denominado "Sample Hub" al grupo concentrador Pipelines . Si visita una página de nivel de proyecto, encontrará Sample Hub en el Pipelines elemento de navegación en el menú de navegación vertical de la izquierda de la página.
Menu GitHub Elemento de menú Definición de compilación Agrega un elemento de menú "Definición de compilación de ejemplo" al Builds centro en el menú de acciones desplegables de la parte superior derecha de la página. El controlador de menú obtiene la definición de compilación actual del contexto que se le pasa, realiza una llamada REST y muestra el resultado en un cuadro de mensaje.
Panel GitHub Contenido del panel, concentrador Se aprovecha en el Hub ejemplo. Es contenido que contiene un botón de alternancia junto con los botones Aceptar/Cancelar. Se puede usar como contenido personalizado del panel o del cuadro de diálogo.
Dinamización GitHub Pestaña Web Agrega una tabla dinámica de ejemplo (pestaña) a la página principal de la organización (colección de proyectos), junto a "Proyectos", "Mis elementos de trabajo" y "Mis solicitudes de incorporación de cambios".
Píldoras GitHub Proveedor de píldoras Agrega pastillas al título de la página Definición de canalización (ejecuciones).
QueryParamsHandler GitHub Suscripción a eventos Agrega un servicio que se carga en cualquier página cada vez que hay un parámetro de consulta "showMyPanel" presente en la dirección URL cuando se carga cualquier página. El servicio de inicio muestra el panel personalizado del ejemplo panel, usando un parámetro de consulta opcional "myPanelTitle" como título del panel.
RepositoryActions GitHub Elemento de menú Agrega un elemento de menú "Acción de repositorio de ejemplo" al selector del repositorio en el encabezado de las páginas del centro de código. Si se proporciona una href propiedad, al hacer clic en la acción se navegará a la dirección URL especificada. Si se proporciona , uri ese código se ejecutará cuando se haga clic en la acción.
RepositoryServiceHub GitHub Hub Agrega un centro de "Información del repositorio" al grupo central Code . Muestra cómo interactuar con para obtener información básica sobre el IVersionControlRepositoryService repositorio git seleccionado actualmente de un usuario.
WorkItemFormGroup GitHub Grupo de formularios de elemento de trabajo Agrega una extensión "Sample WorkItem Form Group" al formulario workitem para mostrar cómo interactuar con el IWorkItemFormService servicio y IWorkItemNotificationListener. Proporciona a la interfaz de usuario mostrar mayúsculas y minúsculas cómo cambiar los valores de campo mediante el servicio de formulario y mostrar eventos de notificación de formularios de objeto de trabajo.
WorkItemOpen GitHub Hub Agrega un concentrador "Sample WorkItem Open" al grupo central boards para mostrar cómo interactuar con el IWorkItemFormNavigationService servicio. Proporciona a la interfaz de usuario que abra un elemento de trabajo existente (por identificador) o abra el formulario de elemento de trabajo para un nuevo elemento de trabajo (por tipo de elemento de trabajo). Cualquiera de estas opciones abre un cuadro de diálogo en el marco host.
Control personalizado de formulario de elemento de trabajo de escala de colores GitHub Control formulario de elemento de trabajo Agregue codificación de colores a los valores de una lista desplegable.
Administración de carpetas GitHub Acción del menú contextual (árbol del explorador de código) Cree una carpeta en los repositorios de origen desde el árbol del explorador de código. No es necesario clonar el repositorio ni instalar herramientas adicionales.
Ejecución de pruebas sin conexión GitHub Pestaña Plan de prueba Permite al evaluador realizar los pasos de prueba incluso si se desconecta de Azure DevOps. Se puede hacer con la hoja de cálculo de Excel exportada.
Tareas de la Utilidad de administración de versiones GitHub Tareas de Administración de versiones Tareas de utilidad para Release Management.
Placa de acumulación GitHub Widget de panel Este widget muestra el número de tarjetas de cada columna del panel Kanban.
Widget de datos de ejemplo GitHub Widget de panel Cree datos de ejemplo en el proyecto de Team Services.
Visualización del modelo de estado GitHub Acción de barra de herramientas (elemento de trabajo), Concentrador Visualice el modelo de estado para un tipo de elemento de trabajo seleccionado.
Team Calendar GitHub Concentrador, orígenes de eventos Realice un seguimiento de los eventos importantes para su equipo, vea y administre días fuera de servicio, vea rápidamente cuándo comienzan y terminan los sprints, etc.
Estado del proyecto de equipo GitHub Widget de panel Permitir a los usuarios visualizar el estado general de las compilaciones, proporcionando una indicación visual similar a Codify Build Light.
WSJF (trabajo más corto ponderado primero) GitHub Notificación (elemento de trabajo), acción de menú contextual (elemento de trabajo) Calcula automáticamente WSJF (trabajo más corto ponderado primero) por elemento de trabajo y lo almacena en un campo de elemento de trabajo.
Listas en cascada GitHub Formulario de elemento de trabajo Defina el comportamiento en cascada para las listas de selección en el formulario de elemento de trabajo.

Primeros pasos

Para empezar lo más rápido posible, hay un proyecto de inicialización disponible que contiene los archivos necesarios para compilar una extensión mediante TypeScript. Para automatizar la compilación, el empaquetado y la publicación de la extensión, se agrega un script grunt.