Static content hosting

Last Update: 9/26/2016

You have the option of hosting static content for your extension (like HTML, CSS, and JavaScript files) on your own service, a third-party hosting service (like Azure or Heroku), or on Visual Studio Team Services directly.

Host on Visual Studio Team Services

In this model, static content is packaged with your extension's .vsix file and is served from a public endpoint at https://publisher.gallery.vsassets.io.

Having Visual Studio Team Services host your extension's static content is useful when you are simply enhancing or decorating data from Visual Studio Team Services. It does not require you (the extension publisher) to setup, manage, or pay for hosting services for your extension

Steps

  1. In your extension manifest file, specify the files you want to include via the files property: json { "files": [ { "path": "scripts", "addressable": true }, { "path": "images/extra/icon1.png", "addressable": true } ] }
  2. Remove the baseUri property (if set) from your extension manifest.
  3. Package your extension (steps)
  4. Publish (or re-publish) your extension (steps)
Important: Make sure to increment the version of your extension when you make changes to static content files included in your .vsix.

Keep in mind:

  • The value specified by the path attribute can be a folder or individual file. If a folder, the entire folder (and any sub-folders) are included.
  • The addressable attribute is important and is what tells Visual Studio Online to make the file(s) URL addressable.
  • All addressable asset requests are case sensitive. If the request for an asset has a different case than the actual uploaded asset, it will result in a HTTP 404 (Not found) error.
  • Not specifying a baseUri (or setting an empty value) tells Visual Studio Online at runtime to calculate the base URI as if your static content is hosted by Visual Studio Team Services.

Host on your own service (or a third-party service)

In this model, static content is served from your own service and not included in your extension's .vsix file.

Steps

  1. Set the baseUri property in your extension manifest For example, assuming a value of https://myservice.net/extension and this hub contribution:
    "baseUri": "https://myservice.net/extension",
    "contributions": [
        {
             "id": "Fabrikam.HelloWorld",
             "type": "ms.vss-web.hub",
             "targets": [
                 "ms.vss-work-web.work-hub-group"
             ],
             "properties": {
                 "name": "Hello",
                 "uri": "hello-world.html"
             }
         }
    ]

Visual Studio Team Services will load the contents of this hub when it is rendered at https://myservice.net/extension/hello-world.html.