Create extension for Visual Studio Team Services

Visual Studio Team Services

Package management enables scenarios where your team needs to share packaged software components within the team or with other teams.Here I am going to create a new Team Services Package by using npm. If you don’t have npm , please install Node.js for windows.

https://nodejs.org/en/

In order to package the extension, you should run a tfx-cli(TFS Cross Platform Command Line Interface ) command using npm .

  • Go to Node.js command prompt and type the command npm i -g tfx-cli and press enter

one

  • Create a new folder somewhere on your local disk for example C:\MyCave\TeamServices\helloworld
  •  Navigate to the above directory from Node.js command prompt

2

  • Once you navigate to the directory use the ‘npm install’ command to retrieve the SDK :npm install vss-web-extension-sdk  and press enter. It will download some files

3

  • Open the helloworld folder from Visual Studio as website for edit
  • Create a new HTML page for your hub. the method init() and notifyLoadSucceeded() will initialize the sdk.

4

  • Add an icon to the img folder that identifies your extension
  • create extension manifest that describes your extension. for this create a JSON file (vss-extension.json ,for example) in the home directory

You can download JSON file from here –  https://plnkr.co/edit/l9eKrr?p=catalogue

6

  • Edit the JSON file – package name, path, version etc
  • Navigate to root directory where vss-extension.json placed and run the command tfx extension create –manifest-globs vss-extension.json for creating the package.

7

  • When you open your directory you could see the package file

8

Enjoy programming…

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s