How to use coffescript with uglify in gulp?

Question

I have following project structure

assets
--javascripts
----controllers
------somefile.js
------somefile.js.coffee

and I would like to compile coffescripts files ( *.js.coffee ) then concat all the files and then minify them.

var gulp = require('gulp')

var concat = require('gulp-concat')
var coffee = require('gulp-coffee');
var uglify = require('gulp-uglify')
var gulpFilter = require('gulp-filter');

gulp.task('scripts', function() {
    var coffeeScriptFilesFilter = gulpFilter(['*.js.coffee']);

    return gulp.src(['assets/javascripts/**/*'])
        .pipe(coffeeScriptFilesFilter)
        .pipe(coffee())
        .pipe(coffeeScriptFilesFilter.restore())
        .pipe(concat('application.js'))

        .pipe(gulp.dest('public'))
        .pipe(uglify().on('error', errorHandler));

   function errorHandler (error) {
     console.log(error.toString());
     this.emit('end');
   }
});

Unfortunately I am getting this error

Error in plugin 'gulp-uglify'
Message:
    /var/www/gulp/public/application.js: Unexpected token: operator (>)
Details:
    fileName: /var/www/gulp/public/application.js
    lineNumber: 3

Without uglify plugin everything works fine. The results is

console.log('hello!');
var lol = 'asd!';
(function() {
  var test;

  test = function() {
    return "lol";
  };

}).call(this);

The uglify plugin probably is trying to compress .js.coffee file but I do not know exactly why. How can I fix it?

Answer 1

Uglify fails because it encounters coffeescript. That indicates that coffeeScriptFilesFilter doesn't catch all the *.coffee.js files.

Given files foo.js.coffee and subdir/foo.js.coffee:

// this matches only foo.js.coffee
gulpFilter('*.js.coffee');

// this matches both
gulpFilter('**/*.js.coffee');

https://github.com/sindresorhus/gulp-filter#pattern

Accepts a string/array with globbing patterns which are run through multimatch