Using gulp in VS2015 to compile LESS in ASP.NET 4.5.2 MVC project

Question

I tried the new ASP.NET vNext and I really liked the way gulp worked. I'm trying to compile LESS using gulp in an ASP.NET 4.5.2 MVC project now.

I followed this for help.
Here's what I've done so far:

Added a package.json file with the following code.

{
  "name": "package",
  "version": "1.0.0",
  "private": true,
  "devDependencies": {
    "gulp": "3.9.0",
    "gulp-bower": "0.0.10",
    "gulp-config": "0.3.0",
    "gulp-less": "3.0.3",
    "gulp-plumber": "1.0.1"
  }
}

Created a Gulp Task in gulpfile.js

var gulp = require('gulp');
var less = require('gulp-less');
var path = require('path');
var plumber = require('gulp-plumber');
gulp.task('less', function () {
    return gulp.src('./Content/**/*.less')
    .pipe(plumber())
      .pipe(less({
          paths: [path.join(__dirname, 'less', 'includes')]
      }))
      .pipe(gulp.dest('./content/'));
});

But then I get the following error (in the output window):

Failed to run "C:\Users\me\documents\visual studio 2015\Projects\projectname\Gulpfile.js"... cmd.exe /c gulp --tasks-simple 'gulp' is not recognized as an internal or external command, operable program or batch file.

I'm guessing npm din't download gulp. Any idea how to get this working?

Answer 1

You shouldn't need to install Gulp globally to work with it in Visual Studio 2015. When Gulp is installed into the project by npm, it adds gulp.cmd to a folder in your project (./node_modules/.bin by default). Visual Studio includes that path by default in the paths where it looks for external tools like Grunt, Gulp, Bower, and npm. This is configurable in Tools->Options->Projects And Solutions->External Web Tools.

My guess is that npm didn't successfully install the packages when you first created the package.json file. Whenever you save your package.json file, Visual Studio will run npm install for your project, so you don't even need to open a console window. But if you added an existing package.json file to the project, it doesn't install for you automatically. In that case you need to run npm install yourself, or open and save the file to get VS to do it for you.

Answer 2

Typing npm install in the Package Manager Console will add a node_modules folder to the project. All of the dependencies specified in the package.json file will be added to that folder.

In this case, now that gulp is installed, the error should be gone.