꿀꺽 거리는 작업이 연결을 수행하지 않습니다.

Question

먼저 내 scss를 빌드하고 끝에 CSS 파일로 결과를 병합하려고합니다.

가 여기 내 작업

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()); 
}); 

이제 최종 결과는 내하는 SCS의 CSS를 포함하는 CSS 파일입니다, 애니메이션의 CSS를 무시 것으로 보인다. 내가 여기서 잘못한 제안이 있니?

Answer 1

I 조언 당신이 event-stream 좀보고, 당신은 훨씬 청소기 구문과의 styles 작업 때문에 같은 끝낼 수 있습니다 : 당신은 말대꾸 수준에서 스타일을 연결해야

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/')); 

});