2016-12-02 3 views
0

나는 훌륭한 scss 파일을 볼 수 있습니다. 변경되면 작업이 실행 중입니다. 변화가 감지되었을 때gulp watch on change 변경 작업이 완료되기 전에 완료 될 때까지 기다림

var sassWatch = gulp.watch([paths.root + '**/*.scss'], ['sass']); 

지금, 나는 CSS 파일 말했다 뭔가를, 변경된 파일을 .CSS하는 확장자를 변경하고 싶지.

sassWatch.on('change', function (ev) { 
     changeNotification('Sass file', ev.type, 'Running compilation'); 
     ev.path = ev.path.substr(0, ev.path.lastIndexOf(".")) + ".css"; 
     return gulp.src(ev.path).pipe(slang(ev.path)); // DO SOMETHING WITH CSS FILE 
    }); 

문제는 말대꾸 작업 이전에 ('변화'... 실행의 마지막 행이 완료된 것입니다.

[11:30:46] Sass file was changed. Running compilation & slinging to AEM. 
[11:30:46] Starting 'sass'... 
[11:30:46] Starting 'sass:compile'... 
[11:30:46] DO SOMETHING WITH CSS FILE 
[11:30:50] Finished 'sass:compile' after 4.59 s 
[11:30:50] Starting 'css:clean'... 
[11:30:50] Finished 'css:clean' after 3.45 ms 
[11:30:50] Finished 'sass' after 4.6 s 

은의 일부 또는 전부를 방지하는 방법이 있나요 ? 작업이 완료되기 전에 실행에서 변경 기능에 같은 것이 나의 이상적인 시나리오는 다음과 같습니다

[11:30:46] Sass file was changed. Running compilation & slinging to AEM. 
[11:30:46] Starting 'sass'... 
[11:30:46] Starting 'sass:compile'... 
[11:30:46] Finished 'sass:compile' after 4.59 s 
[11:30:50] Starting 'css:clean'... 
[11:30:50] Finished 'css:clean' after 3.45 ms 
[11:30:50] Finished 'sass' after 4.6 s 
[11:30:50] DO SOMETHING WITH CSS FILE 

답변

1

run-sequence 패키지하자 여러 작업을 하나씩 실행하여 캘리포니아에서. 실제로 여러 작업을 실행할 필요가 없습니다. 하나의 작업을 실행 한 다음 함수를 실행하면됩니다.

다행히 run-sequence은 모든 작업이 끝날 때 호출되는 콜백 함수를 허용합니다. 따라서 콜백 함수에 전체 DO SOMETHING WITH CSS FILE을 붙이면됩니다.

var runSequence = require('run-sequence'); 

gulp.watch([paths.root + '**/*.scss'], function (ev) { 
    runSequence('sass', function() { 
    changeNotification('Sass file', ev.type, 'Running compilation'); 
    ev.path = ev.path.substr(0, ev.path.lastIndexOf(".")) + ".css"; 
    return gulp.src (ev.path).pipe(slang(ev.path)); // DO SOMETHING WITH CSS FILE 
    }); 
});