gulp-sequence not working - gulp

Question

I have implementing gulp task in the project.
I have installed gulp-assests-version-replace to make version control file of css file.
Now I want to run above task after creating the app.css. It runs before creating the app.css, so version control file cannot be created.
Below is the gulp-file for running the gulp tasks.
var gulp = require('gulp');
var autoprefixer = require('gulp-autoprefixer');
var changed = require('gulp-changed');
var concat = require('gulp-concat');
var del = require('del');
var gulpif = require('gulp-if');
var gutil = require('gulp-util');
var imagemin = require('gulp-imagemin');
var jshint = require('gulp-jshint');
var notify = require('gulp-notify');
var plumber = require('gulp-plumber');
var rename = require('gulp-rename');
var sass = require('gulp-sass');
var assetsVersionReplace = require('gulp-assets-version-replace');
var uglify = require('gulp-uglify');
var path = {
assets: 'skin/frontend/custom_theme/default/'
};
var config = {
tasks: {
css: {
autoprefixerOptions: {
// For "browserslist" see "package.json"
cascade: false,
supports: false // See: https://github.com/filamentgroup/select-css/issues/17
},
dest: path.assets + 'css/build',
sassOptions: {
outputStyle: 'compressed'
},
src: path.assets + 'css/src/**/*.scss'
},
version: {
autoprefixerOptions: {
// For "browserslist" see "package.json"
cascade: false,
supports: false // See: https://github.com/filamentgroup/select-css/issues/17
},
dest: path.assets + 'css/build',
sassOptions: {
outputStyle: 'compressed'
},
src: path.assets + 'css/build/app.css'
}
}
}
gulp.task('default', ['clean'], function () {
gulp.start('css');
gulp.start('assetsVersionReplace');
});
gulp.task('clean', function () {
return del([
path.assets + 'css/build',
path.assets + 'js/build',
path.assets + 'js/min',
path.assets + 'img/build'
]);
});
gulp.task('css', function () {
return gulp.src(config.tasks.css.src)
.pipe(plumber({
errorHandler: reportError
}))
.pipe(sass(config.tasks.css.sassOptions))
.pipe(autoprefixer(config.tasks.css.autoprefixerOptions))
.pipe(gulp.dest(config.tasks.css.dest));
});
gulp.task('assetsVersionReplace', function () {
return gulp.src(config.tasks.version.src)
.pipe(assetsVersionReplace({
replaceTemplateList: [
'app/design/frotend/custom_theme/default/template/page/head.phtml'
]
}))
.pipe(gulp.dest(config.tasks.version.dest))
});
gulp.task('watch', function () {
// Run "default" immediately
gulp.start('default');
// CSS
gulp.watch(config.tasks.css.src, ['css']);
gulp.watch(config.tasks.version.src, ['assetsVersionReplace']);
});
How can I run assetsVersionReplace task after creating the css (or after runnung 'CSS' task)?

Answer 1

Either change
gulp.task('assetsVersionReplace', function () {
to
gulp.task('assetsVersionReplace', ['css'], function () {
or, if that isn't an option, add a helper task
gulp.task('assetsVersionReplaceAfterCss', ['css'], function () {
gulp.start('assetsVersionReplace');
}
and use that instead

Answer 2

Why don't you use gulp series.
gulp.task('default',
gulp.series(
'css',
'assetsVersionReplace'
)
);