Using Gulp with ASP.NET vNext and Visual Studio 2015 Preview

After playing with ASP.NET vNext and VS.NET 2015 a bit, I decided I wanted to switch from Grunt to my preferred build system for Node, Gulp. Although Gulp is supported, documentation is currently lacking and the VS.NET preview has some instability so it took me a few minutes to figure it out. Here are the steps that worked for me:

1) Make the package.json created by VS.NET complete so that npm will be able to add references.

npm init

2) Install gulp and uninstall grunt from the project

npm install -g gulp
npm install --save-dev gulp
npm uninstall --save-dev grunt

3) Install gulp-bower

npm install --save-dev gulp-bower

4) Add a gulpfile.js to the root of your web project with the following contents:

var gulp = require('gulp');
var bower = require('gulp-bower');

gulp.task('bower', function () {
    return bower({ layout: "byComponent"})
        .pipe(gulp.dest('wwwroot/lib'));
});

5) Modify project.json to use your new gulp task instead of grunt in the scripts section.

"scripts": {
        "postrestore": [ "npm install" ],
        "prepare": [ "gulp bower" ]
    }

6) Delete gruntfile.js

7) Close VS.NET and reopen and it should all work with gulp.

%d bloggers like this: