Конфигурация Gulp не работает

Question

Я пытаюсь запустить Gulp, чтобы минимизировать CSS, JS и переместить все статические вещи (template, font, img) в папку build.

Мой проект структуры каталогов:

- project 
|- gulpfile.js 
|- package.json 
|- src 
||- font 
||- img 
||- js 
||- sass 
||- template 
|- build 
||- css 
||- font 
||- img 
||- js 
||- template 

Мои gulpfile.js:

var PATH = { 
    SRC: { 
     SASS: 'src/sass/', 
     JS: 'src/js/', 
     TEMPLATE: 'src/template/', 
    }, 
    DEST: { 
     CSS: 'build/css/', 
     JS: 'build/js/', 
     TEMPLATE: 'build/template/', 
    } 
}; 


var gulp = require('gulp'), 
    autoprefixer = require('gulp-autoprefixer'), 
    concat = require('gulp-concat'), 
    minifyCss = require('gulp-minify-css'), 
    rename = require('gulp-rename'), 
    sass = require('gulp-ruby-sass'), 
    uglify = require('gulp-uglify'); 


gulp.task('compress', function() { 
    return gulp.src(PATH.SRC.JS + '*.js') 
     .pipe(concat('all.js')) 
     .pipe(uglify()) 
     .pipe(gulp.dest(PATH.DEST.JS)) 
     .pipe(rename({suffix: '.min'})) 
     .pipe(gulp.dest(PATH.DEST.JS)); 
}); 

gulp.task('styles', function() { 
    return gulp.src(PATH.SRC.SASS + '*.scss') 
     .pipe(sass(PATH.SRC.SASS, { style: 'expanded' })) 
     .pipe(autoprefixer({ 
      browsers: ['last 2 version', 'safari 5', 'ie 8', 'ie 9'], 
      cascade: true 
     })) 
     .pipe(concat('all.css')) 
     .pipe(gulp.dest(PATH.DEST.CSS)) 
     .pipe(rename({suffix: '.min'})) 
     .pipe(minifyCss()) 
     .pipe(gulp.dest(PATH.DEST.CSS)); 
}); 


gulp.task('watch', function() { 
    gulp.watch(PATH.SRC.SASS + '*.scss', ['styles']); 
    gulp.watch(PATH.SRC.JS + '*.js', ['compress']); 
}); 

gulp.task('default', ['watch', 'styles', 'compress']); 

Когда я бегу gulp или gulp watch я получаю эту ошибку:

/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:623 
    var written = dest.write(chunk); 
        ^
TypeError: undefined is not a function 
    at write (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:623:24) 
    at flow (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:632:7) 
    at DestroyableTransform.pipeOnReadable (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:664:5) 
    at DestroyableTransform.emit (events.js:104:17) 
    at emitReadable_ (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:448:10) 
    at emitReadable (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:444:5) 
    at readableAddChunk (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:187:9) 
    at DestroyableTransform.Readable.push (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:149:10) 
    at DestroyableTransform.Transform.push (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:145:32) 
    at afterTransform (/project/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:101:12) 

Как я могу это исправить?

Answer 1

gulp-ruby-sass недавно изменил API. Таким образом, вы не можете передать что-то в задачу Sass, а скорее начать с нее. Очень похоже browserify. gulp-ruby-sass создает поток, однако, так что остальная часть трубы должна работать нормально:

gulp.task('styles', function() { 
    return sass(PATH.SRC.SASS, { style: 'expanded' }) 
     .pipe(autoprefixer({ 
      browsers: ['last 2 version', 'safari 5', 'ie 8', 'ie 9'], 
      cascade: true 
     })) 
     .pipe(concat('all.css')) 
     .pipe(gulp.dest(PATH.DEST.CSS)) 
     .pipe(rename({suffix: '.min'})) 
     .pipe(minifyCss()) 
     .pipe(gulp.dest(PATH.DEST.CSS)); 
});