Visual Studio Team Services Gulp Task Setup

While working on a project I required to use the Visual Studio Team Services Gulp task. This is a free pre-built module in the VSTS build and release section that runs, yes you guessed it, gulp tasks. As much as it is very good and the directions on use are good, there is one part I found hard on how to pass the arguments into the task. Therefore let me guide you to how I found worked perfectly.

You can get more notes from the Microsoft page on the task

gulp

Above is a screenshot of what the current task variables/values look like. From top to bottom:

  • Display name – The name you want to call your task for example ‘Build Solution’
  • Gulp File Path – The directory location to your ‘gulpfile.js’ which can be in the build directory or located on the receiving server.
  • Gulp Task(s) –  The name of the task or tasks to run. You enter these just like you would on the command line e.g. ‘buildSolution’ or for multiple tasks ‘getPackages buildSolution’
  • Arguments – These are the argument you wish to pass to the gulp tasks.

Arguments

So at first you might just enter your arguments straight in, which I found didn’t work. When I do this I go the below result:

[command]C:\Program Files\nodejs\node.exe C:\agent\_work\1\s\Source\node_modules\gulp\bin\gulp.js buildSolution --gulpfile arg1 arg2 arg3 arg4

However this resulted in:

Task 'C:\agent\_work\1' is not in your gulpfile

Weird I know and I am sure better gulp experts might be able to identify what I did wrong, but other than this error there is another issue. When you retrieve these variables you use ‘process.arg’, which returns all the arguments as an array. This includes though everything in the command line so you result with:

process.arg[0] = C:\Program Files\nodejs\node.exe
process.arg[1] = C:\agent\_work\1\s\Source\node_modules\gulp\bin\gulp.js
process.arg[2] = buildSolution
process.arg[3] = --gulpfile
process.arg[4] = arg1
process.arg[5] = arg2
process.arg[6] = arg3
process.arg[7] = arg4

So in your gulp script your going to need to know the exact location in the array or know the value, which isn’t very helpful or easy. However I read this great post on Sitepoint How to Pass Command Line Parameters to Gulp Tasks

In it they explain and show the code on how you can pass the arguments in a name/value manner, for example ‘–arg1 argVal’. On the initiation of the JavaScript document the code will parse the ‘process.arg’ into an object by detecting values with ‘–‘ as the name and the next value as the parameter.

Therefore turning this:

[command]C:\Program Files\nodejs\node.exe C:\agent\_work\1\s\Source\node_modules\gulp\bin\gulp.js buildSolution --gulpfile  --arg1 arg1Val --arg2 arg2Val --arg3 arg3Val

Into this in the file:

var args = {'arg1' : 'arg1Val','arg2' : 'arg2Val','arg3' : 'arg3Val'}

And then any of your arguments can be used as :

var myArg = args.arg1;

This making it 100% much easier to pass and then access the arguments in your gulp files. As well as in the link above you can also see the code below:

// fetch command line arguments
const arg = (argList => {let arg = {}, a, opt, thisOpt, curOpt;
  for (a = 0; a < argList.length; a++) {thisOpt = argList[a].trim();
    opt = thisOpt.replace(/^\-+/, '');if (opt === thisOpt) {// argument value
      if (curOpt) arg[curOpt] = opt;
      curOpt = null;}
    else {// argument name
      curOpt = opt;
      arg[curOpt] = true;}}return arg;})(process.argv);

Leave a message please

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s