Glen Smith

Gulp is becoming a super important part of my toolchain, as is Azure and its funky Git deploys. Wouldn’t it be awesome if you could run a Gulp job during Azure’s git autodeploy? Say, to pull down all your Bower deps and run a few transformations on your index.html? Well you can, and it’s a snack to setup!

Installing Azure NPM tools

First of all, you’ll need to install the azure npm tools. You’ll really only use this tool for generating the default deployment script (which we’re going to tweak). Let’s just install it globally

npm install azure-cli -g

With the tools install, next step it to generate a default.cmd:

azure site deploymentscript –-node ./

Note: I needed to add an explicit path to the end of the line for this command to work on windows - otherwise I would get the help message. YMMV.

You should now see a Deploy.cmd file generated in your working directory (and a .deployment file that references it).

Customising your Deploy.cmd

Deploy.cmd is where the magic happens. Azure runs this script as part of its deployment process, so you have the hooks you need to tweak the deploy.

With your default deploy.cmd created, the next job is to do a little customisation. Have a look for the section of the file that is marked “Deployment”, then you’ll need to make a couple of small mods:

Customise Step 3: Remove the –production switch to the NPM installs (otherwise it won’t install all those “–save-dev” development NPMs that you setup
Add Step 4: To slurp down your Bower dependencies
Add Step 5: To launch your Gulp task (I’m just using my default Gulp task, but feel free to launch with a specific Gulp task if that suits).
Here’s a completed gist (for just that section of the file with the next step 3/4/5) - you can see my complete file in the Thrifebook github repo:

https://gist.github.com/glenasmith/11a0f589b4833d0360f6

With your Gulp task ready to rock. Just stage and check-in your deploy.cmd, and “git push”. When Azure deploys your project you’ll be Gulping and Bowering up a storm!