Integrate SharePoint 2013 Design Manager with TFS

August 13 2012 54 comments

I think all artefacts produced in a SharePoint project should be treated as software artefacts. This includes all the UI stuff implemented by designers, such as css files and master pages.

Treating them as software artefacts means that they should be version-controlled. The problem is that there’s no design tool that integrates with TFS, making version control integration with the designers’ workflows can be a pit of a pain.

I wanted to talk to you quickly about how you could do this in SharePoint 2013. Let’s assume we want to take advantage of SharePoint 2013’s new design manager capabilities and have all your stuff stored safely in TFS.

We could end up with the following list of requirements for the designer’s workflow:

  • The designer should be able to edit the design files with any editor
  • The designer should be able to see any changes automatically in SharePoint, without copying files manually
  • The designer should have to use Visual Studio only as a version control client, nothing more

Here’s an approach you might want to try out:

  • Map an SP2013 master page gallery as a network drive (using the new WebDAV), e.g. Y:
  • Create a project in TFS, say $/MyDesignProject
  • Map the TFS project’s working folder to your master page gallery’s network drive (Y drive)
  • Add, modify any design files in the web editor of your choice
  • When you’re done, the following tasks may need to be done:

1. If you modified a file, you’ll need check in your changes in Source Control Explorer. If someone else had checked in some changes to the same file, you’ll need to merge
2. If you added a file, you need to add it to TFS in Source Control Explorer before you can check it in, but this should be no biggie
3. To delete a file, you have to delete it through the Source Control Explorer. The file will be deleted automatically from your working folder (which now is also your master page gallery).

One thing this approach doesn’t solve is building your solutions. In order to build your design package (.wsp) for deployment, you’ll need to export it using Design Manager. You can’t do it in Visual Studio, unless

  • You pre-create a new SharePoint Project in $/MyDesignProject and do some crazy folder mappings that I haven’t tried yet
  • Custom code

Hope this helps!

Popularity: 1% [?]

54 comments to “Integrate SharePoint 2013 Design Manager with TFS”

  1. Steph says:

    It should not be necessary for the designer to manually copy files in order to view any changes that occur in SharePoint. Regards from Denver attorney

  2. Michael says:

    All artifacts created in a SharePoint project should be regarded as software artifacts. This encompasses all UI components designed by developers, and Adrenaline Marketing Pros including CSS files and master pages.

  3. Russell says:

    It’s nice seeing this informative content here. Thanks for the share. luxury scrubs

  4. Kimmy says:

    Thank you for keeping us here posted. Elite Roofing Sacramento new roof

Leave a Reply