Use Grunt to Manage JavaScript Builds on TFS

Grunt LogoNewly-released open source code from Microsoft Open Technologies, Inc., now makes it possible to automate JavaScript build and test jobs on Team Foundation Server (TFS) using Grunt, the JavaScript Task Runner. Grunt focuses on automating repetitive tasks so that you can focus on writing code. It makes a great addition to any JavaScript developer’s productivity tool set. You can find the code in GitHub.

Like many popular open source projects Grunt has a growing ecosystem of developers and users that are providing hundreds of plugins to allow it to automate an increasingly large range of build activities. Some of the most popular plugins today provide support for: 

  • JSHint – a tool for detecting errors and potential problems in JavaScript code
  • Watch – the capability to run predefined tasks whenever a watched files are changed, added or removed
  • Uglify –  a JavaScript file compression utility
  • Less –  a tool to compile LESS files into CSS
  • Coffee –  a tool to compile CoffeeScript files into JavaScript

There is community plugins for common (and many not so common) JavaScript build tasks - at the time of writing there are 3055 total entries in the Grunt plugin directory. In addition to providing a complete set of plugins, Grunt provides a full-featured API that can readily be integrated into in-house systems.

Using Grunt in Web and JavaScript App Development

Automating build related activities with Grunt ensures that all code you produce will build and run as expected. Grunt can also be used to enforce coding standards and style guides. Code quality tools help to catch problematic code structures and common errors. The end result will be more productive software development – you will be able to have cleaner code with less effort.

When combined with TFS, Grunt can also be used in a continuous deployment scenario. This means that any build, once successfully run and tested through Grunt, can then be deployed to Microsoft Azure. In a well-configured environment, this can further improve the JavaScript development experience for Azure websites.

Grunt has already published some excellent tutorials and guides as well as documentation to its website. The diagram below summarizes the configuration you need to use it on TFS.

Grunt Setup

We believe this new support for Grunt on TFS is an important feature for JavaScript developers. Please take a look and share your feedback!

7 thoughts on “Use Grunt to Manage JavaScript Builds on TFS

  1. Pingback: Front end development with Visual Studio | Maxime Lemaitre – Cybermaxs

  2. For those looking to mix TFS and the NodeJS/Grunt ecosystems – be wary. TFS still relies on Windows API’s from the days of DOS that limit file paths to 260 characters and NPM’s nested dependency structure can easily exceed this.

  3. Pingback: Adding gulp to Visual Studio Online Builds - Nick's Blog - Site Home - MSDN Blogs

  4. Pingback: Adding gulp to Visual Studio Online Builds – Wintellect DevCenter