Aracılığıyla paylaş


Bir hub ekle

Azure DevOps Hizmetleri

Bu makalede Sprint'ler ve Sorgular hub'larından sonra Azure Boards'da görüntülenen yeni bir hub oluşturacağız.

Azure Boards'ta yeni hub'ın konumunu gösteren ekran görüntüsü.

Uzantının yapısı

|--- README.md
|--- sdk    
	|--- node_modules           
	|--- scripts
		|--- SDK.js       
|--- images                        
	|--- icon.png                           
|--- scripts                        	// not used in this tutorial
|--- hello-world.html				// html page to be used for your hub  
|--- vss-extension.json				// extension's manifest

İstemci SDK'sını edinin: SDK.js

SDK.jstemel SDK betiği, web uzantılarının Azure DevOps Services ana bilgisayar çerçevesi ile iletişim kurmasını sağlar. Bu betik ayrıca başlatır, uzantının yüklendiğini bildirir veya geçerli sayfa hakkında bağlam bilgisini alır. İstemci SDK'sı SDK.js dosyasını alın ve web uygulamanıza ekleyin. home/sdk/scripts klasörünün içine yerleştirin.

SDK'yi almak için komut satırı ( Node gerektirir) aracılığıyla 'npm install' komutunu kullanın:

npm install azure-devops-extension-sdk

Uyarı

Daha fazla bilgi için bkz. Azure DevOps Web Uzantısı SDK'sı.

Hub sayfanız: hello-world.html

Uzantınızın dizininde hello-world.html bir home dosya oluşturun. SDK'ya başvurun ve init() ve notifyLoadSucceeded() çağrısı yapın.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>Hello World</title>
	<script src="sdk/scripts/SDK.js"></script>
</head>
<body>
	<script type="text/javascript">SDK.init();</script>
	<h1>Hello World</h1>
	<script type="text/javascript">SDK.notifyLoadSucceeded();</script>
</body>
</html>

Uzantınızın bildirim dosyası: vss-extension.json

vss-extension.json dizininde, aşağıdaki içeriklere sahip bir json dosyası oluşturun (örneğin, home).

	{
		"manifestVersion": 1,
		"id": "sample-extension",
		"version": "0.1.0",
		"name": "My first sample extension",
		"description": "A sample Visual Studio Services extension.",
		"publisher": "fabrikamdev",
		"categories": ["Azure Boards"],
		"targets": [
			{
				"id": "Microsoft.VisualStudio.Services"
				}
			],
		"icons": {
			"default": "images/logo.png"
		 },
		"contributions": [
			{
				"id": "Fabrikam.HelloWorld",
				"type": "ms.vss-web.hub",
				"description": "Adds a 'Hello' hub to the Work hub group.",
				"targets": [
					"ms.vss-work-web.work-hub-group"
					],
				"properties": {
					"name": "Hello",
					"order": 99,
					"uri": "hello-world.html"
				}
			}
		],
		"scopes": [
			"vso.work"
		],
		"files": [
			{
				"path": "hello-world.html", "addressable": true
			},
			{
				"path": "sdk/scripts", "addressable": true
			},
			{
				"path": "images/logo.png", "addressable": true
			}
		]
	}

Uyarı

Yayımcıyı yayıncı adınıza değiştirin. Yayımcı oluşturmak için bkz. Paketleme, yayımlama ve yükleme.

Simgeler

Simge bölümü, manifest dosyanızda uzantınızın simgesinin yolunu belirtir.

Uzantı bildiriminde gösterildiği gibi başlıklı logo.pngkare bir görüntü ekleyin.

Katkılar

Katkılar stanza, uzantı bildiriminize katkınızı (Hello hub'ı) ekler.

Uzantınızdaki her katkı için bildirim aşağıdakileri tanımlar:

  • katkı türü, merkez
  • katkı hedefi, iş merkezi grubu (tüm hedeflenebilir hub gruplarına göz atın,
  • her katkı türüne özgü özellikler. Hub aşağıdaki özelliklere sahiptir.
Mülkiyet Açıklama
isim Hub'ın adı.
sipariş/emir Hub'ın merkezi birim grubuna yerleştirilmesi.
URI Sayfanın, merkez olarak görünür hale getirilmek üzere, uzantı tabanı URI'sine göre yolu.

Kapsamlar

Uzantınızın gerektirdiği kapsamları dahil edin.

Bu durumda iş öğelerine erişmek için vso.work ihtiyacımız var.

Dosyalar

Dosyalar stanza, paketinize eklemek istediğiniz dosyaları (HTML sayfanız, betikleriniz, SDK betiği ve logonuz) belirtir.

addressable URL adreslenebilir olması gerekmeyen başka dosyalar eklemediğiniz sürece true olarak ayarlayın.

Uyarı

Özellikler ve işlev gibi uzantı bildirim dosyası hakkında daha fazla bilgi için uzantı bildirimi başvurusuna bakın.

Sonraki Adımlar