Publishing a VSTS extension

We have seen in a previous article, the bases to create an extension for VSTS, that is to say, the pre-requisites and the structure of the Visual Studio solution.

But before you can use the extension remains of published step.

Publish an extension for VSTS is to:

  • Create VSIX package that contains the manifest
  • Upload this package in the Visual Studio publisher Marketplace
  • Publish files in a third website (as azure)

Pre-requisites

Hosting mode

There are 2 Hosting modes of necessary files (html, js, css, …) for the extension:

Either the files are hosted in a third host such a website Azure :.

In this case:

  • The manifest file vss-extension.json property contains the baseURI URL with https (https VSTS being, he can call a url https) of this website and does not contain the property files.
  • Only the file vss-extension.json will be included in the package VSIX to publish

Either all files are included in the package to be published.

In this case

  • The file vss-extension.json contains the property files with the list of directories and files needed for the extension and that will be included in the package VSIX to publish.
  • The baseURI property must be not present

extension configuration

Scope visibility

The scope of extending visibility is configured in the in the file vss-extension.json property public which by default is set to false.

To make a public extension, it has pre-requisites and a process that available here.

To use a private extension must share it with VSTS accounts to want give the rights to use the extension.

Creating a publisher

The publisher is the storage space where are uploaded packages. Each account can have multiple LiveID publisher.

To create a publisher

create publisher

In the file vss-extension.json fill the property publisher with the ID created.

Update the manifest file

In the manifest file must be added the property

« targets »: [{« id »: « Microsoft.VisualStudio.Services »}],

Which is not present in the project template.

Creating the package

Once all completed prerequisites, that is to say that the publisher is created, the type of hosting is chosen and therefore the is successfully vss-extension.json file completed, we can generate the VSIX package that will be uploaded to the publisher.

The first thing to do before creating the package is the project compilation to generate the js JavaScript file from the typescript file.

The package generation is done from the command line with the tools vset which must be recovered by the package manager npm

npm install vset -save-dev

Once installed, a prompt to stand in the project directory, and run the command

vset package

create package

As explained in the previous article, the project template provided for extensions has a support library for the generation and publication of the extension.

To benefit from this help you must install the client Grunt via npm command and compile the project, the package is automatically generated.

From my side, I used the task runner explorer or I installed the extension to Visual Studio Grunt Luncher that allows Grunt execute orders directly from Visual Studio.

grunt

gruntfile vs

After this run the VSIX package is generated in the project directory, the name is composed of the publisher ID, ​​the extension name and version.

vsix

Publish an extension for VSTS

After the package generation that remains more than the package upload and sharing in the publisher.

To upload an extension, you must go to your publisher and click the button Upload new extension.

upload extension

Once the upload completed, since the extension is private must share for it to be accessible and usable in a VSTS account.

To do that click the button Share and enter the account you want VSTS give the rights to use the extension.

share extension

Publication in a third website

For it is desired that the extension of files to be hosted on a third party web site, you must publish the files

of this publication may be made ​​directly via Visual Studio.

All documentation to host the files in azure here

Install Extension

The extension is available in your account VSTS you still need to install it to use it.

In the manager of extension, private and shared extensions are in the heading with this Shared Account.

install extension

The installation procedure is explained in the article on the presentation of the Visual Studio Marketplace.

Run the extension

When the extension is installed, you can directly use.

run extension

Summary

This series of articles showed a presentation of extensions for VSTS, how to create and publish its extensions.

With the extensions it is possible to do more than this example. It is also possible to extend the form of a work item or create his job build, the official documentation can be very useful.

This article is a English traduction of my french article

Thanks to Etienne Tremblay for his contribution.

My DevOps Links #2

My DevOps Links #2. Continue reading

My DevOps Links #1

Published on January 02, 2019

Get list of Azure VM IP addresses based on tags

Published on October 23, 2018