If you have read this Blog, my book, reviewed my code, worked with me or attended one of my presentations you know Grunt is a must have tool for modern web development. The problem for Visual Studio developers is having to open a command window to execute Grunt and manually manage the Gruntfile.js. I kept thinking, there has to be a better way...

As of a week ago there is a better way! The ASP.NET team has introduced a Visual Studio extension to manage and run your task runners. The extension is designed to work with Grunt and Gulp, both node based task runners. This is exciting news!

Once installed to access the task runner window you can either right click on your Gruntfile.js and select the Task Runner from the context menu or find it in the Views + Other Windows menu. Visual Studio will launch the task explorer as a free floating window. I recommend docking as one of your bottom windows because it is a two column experience and typically wider than I like along the right-hand side of my IDE. The extension does require Visual Studio 2013.3, that means update 3. If you are stuck using an earlier Visual Studio version you can still execute your task runner script by adding the command line call to your project's build events. This is how I have done it for a couple of years now.

The task runner explorer automatically parses your Gruntfile and allows you to execute individual tasks or run the entire script. The explorer consist of two panes, tasks and bindings. The task pane list each task configured in your Grunt or Gulp file. You can execute a single task or all the task at once. The first node is Alias Task and you should see 'default'. This option is what I normally execute. When executing a task you will see the command line output echoed in a new pane to the right of the tasks pane.

To bind a task to a build event right-click the task and a context menu is displayed. Select bindings and you will see options for different phases of your project's build. You can assign your task to one or more of these events. You will see this reflected in the Bindings pane.

I am very excited to see this and other extensions being offered to Visual Studio to make the web development experience much better. Especially since node based tools have become such an important part of the web development work flow.

Share This Article With Your Friends!