How to deploy gulp-ftp, after previos task? - node.js

Question

i have a problem with two gulp task in npm.js. First task compile project, next tast deploy it on ftp. If I run them separately - all work, but when i try to use them together, its now work. I think its a stream error. Cuz gulp ftp (second task) finish faster then (first task). Can someone help with this?
First task:
gulp.task('build', ['nib', 'html', 'scripts'], function() {
var removeDist = del.sync('app/dist');
var buildCSS = gulp
.src('app/chache/css/*.css')
.pipe(cssnano())
.pipe(gulp.dest('app/dist/css'));
var buildImg = gulp
.src(['app/html-dev/img/**/*', '!app/html-dev/img/empty.jpg'])
.pipe(imagemin({
interlaced: true,
progressive: true,
svgoPlugins: [{ removeViewBox: false }],
une: [pngquant()]
}))
.pipe(gulp.dest('app/dist/img'));
var buildFonts = gulp
.src(["app/html-dev/fonts/**/*", '!app/html-dev/fonts/empty.woff'])
.pipe(gulp.dest('app/dist/fonts'));
var buildJS = gulp
.src("app/chache/js/**/*")
.pipe(gulp.dest('app/dist/js'));
var buildHhtml = gulp
.src("app/chache/*.html")
.pipe(gulp.dest('app/dist'));
});
Ftp Task:
gulp.task('ftp', ['build'], function () {
return gulp.src('app/dist/**')
.pipe(ftp(ftpinfo))
// you need to have some kind of stream after gulp-ftp to make sure it's flushed
// this can be a gulp plugin, gulp.dest, or any kind of stream
// here we use a passthrough stream
.pipe(gutil.noop());
});
Error:
[13:34:47] Using gulpfile ~\Desktop\test-dist\gulpfile.js
[13:34:47] Starting 'nib'...
[13:34:47] Starting 'html'...
[13:34:47] Starting 'scripts'...
[13:34:47] Finished 'scripts' after 9.31 ms
[13:34:50] Finished 'nib' after 3.35 s
[13:34:50] Finished 'html' after 3.34 s
[13:34:50] Starting 'build'...
[13:34:50] Finished 'build' after 21 ms
[13:34:50] Starting 'ftp'...
[13:34:50] gulp-ftp: No files uploaded
[13:34:50] Finished 'ftp' after 6.5 ms
[13:34:50] gulp-imagemin: Minified 0 images

Answer 1

You need to return the stream from the dependancy task, 'build'. Otherwise the parent task 'ftp' won't wait for 'build'to end.
Since that task has multiple src you need to merge them with merge-stream
var merge = require('merge-stream');
gulp.task('build', ['nib', 'html', 'scripts'], function() {
var removeDist = del.sync('app/dist');
return merge(
gulp
.src('app/chache/css/*.css')
.pipe(cssnano())
.pipe(gulp.dest('app/dist/css')),
gulp
.src(['app/html-dev/img/**/*', '!app/html-dev/img/empty.jpg'])
.pipe(imagemin({
interlaced: true,
progressive: true,
svgoPlugins: [{ removeViewBox: false }],
une: [pngquant()]
}))
.pipe(gulp.dest('app/dist/img')),
gulp
.src(["app/html-dev/fonts/**/*", '!app/html-dev/fonts/empty.woff'])
.pipe(gulp.dest('app/dist/fonts')),
gulp
.src("app/chache/js/**/*")
.pipe(gulp.dest('app/dist/js')),
gulp
.src("app/chache/*.html")
.pipe(gulp.dest('app/dist'))
);
});