CODEWITHSUNDEEP
angularjsgulp
Peter Kellner
Peter Kellner

Reputation: 15508

Problems with gulp and gulp-diff

I'm wanting my gulpfile.js to compare what is in my angular concatenated file before it has ng-annotate run and after so I can see what injections it made. I can't quite get the syntax. I keep getting different versions of the error which says gulp can not stat my file.

The code that I'm stuck on is below. I'd be happy to do it in one pass but had no success with that either.

gulp.task('scripts', function () {

    gulp.src(['public/app/**/*.js'])
        .pipe(concat('main-noanotate.js'))
        .pipe(rename({suffix: '.noannotate.js'}))
        .pipe(gulp.dest('public/dist'));


    return gulp.src(['public/app/**/*.js'])
        .pipe(concat('main.js'))
        .pipe(ngAnnotate())
        .pipe(diff('main.noannotate.js'))
        .pipe(diff.reporter({ fail: true }))
        .pipe(gulp.dest('public/dist'))
});

Upvotes: 2

Views: 612

Answers (1)

diff_sky
diff_sky

Reputation: 561

gulp-diff is trying to diff against the original source file, but there is no original source file on disk as you're working with the result of a concatenation of multiple files. I recommend splitting out your gulp tasks and writing to a temporary .build directory.

Here is an example of clearing a build workspace.

To set things up, create a new directory and run:

npm install del gulp gulp-concat gulp-diff gulp-header; mkdir -p src; echo "foo" > src/foo.txt; echo "bar" > src/bar.txt

Then create this gulpfile.js:

'use strict';

var gulp = require('gulp');
var diff = require('gulp-diff');
var header = require('gulp-header');
var concat = require('gulp-concat');
var del = require('del');

gulp.task('default', ['clean']);

gulp.task('clean', ['build'], function(cb) {
  del(['.build'], cb);
});

gulp.task('build', ['concat'], function() {
  return gulp.src('.build/all.txt')
    .pipe(header('//stream test\n'))
    .pipe(diff())
    .pipe(diff.reporter())
    .pipe(gulp.dest('./dist'));
});

gulp.task('concat', function() {
  return gulp.src('src/*.txt')
    .pipe(concat('all.txt'))
    .pipe(gulp.dest('.build'));
});

Then try running gulp. It should concat the file and put the output into the temporary .build directory. That file is then used to diff against. In the above example header is doing the job of amending the file (this might be where you apply ngAnnotate instead).

Upvotes: 4

Related Questions