CODEWITHSUNDEEP
csssassgulp
Jeanluca Scaljeri
Jeanluca Scaljeri

Reputation: 29097

gulp task doesn't do concat

I'm trying to first build my scss and at the end merge the result with a css file.

Here is my task

gulp.task('styles', function () {
    gulp.src('../scss/styles.scss')
        .pipe($.sass({
            errLogToConsole: true
        }))
        .pipe($.autoprefixer('last 2 versions'))
        .pipe(gulp.dest('../public/styles/'))
        .pipe($.filelog())
        .pipe($.size());

   gulp.src([
               '../public/bower_components/animate.css/animate.css',      
               '../public/styles/styles.css'
            ], {base: '.'})
        .pipe($.concat('../public/styles/styles.css'))
        .pipe($.filelog())
        .pipe($.size());
});

Now the end result is a css file which only contains my scss css, it seems that the animate css is ignored. Any suggestions what I do wrong here ?

Upvotes: 0

Views: 246

Answers (1)

Preview
Preview

Reputation: 35796

I advice you to have a look at event-stream, you can end up with something like so for your styles task with a much cleaner syntax :

es = require('event-stream');

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

  var _css = gulp.src(['../public/bower_components/animate.css/animate.css',      
                      '../public/styles/styles.css'], {base: '.'});

  var _sass = gulp.src('../scss/styles.scss')
               .pipe($.sass({ errLogToConsole: true }))
               .pipe($.autoprefixer('last 2 versions'));

  return es.merge(_sass, _css)
           .pipe($.concat('styles.css'))
           .pipe($.filelog())
           .pipe($.size())
           .pipe(gulp.dest('./public/styles/'));

});

Upvotes: 2

Related Questions