I’ve got this function on Gulp that precompiles templates and partials and then outputs a file. Well, only sometimes, that is.

I can’t seem to wrap my head around the ‘inner workings’ of Gulp.

function templates () {
    if ( templates_source.length ) {
        var hr = gulp.src(['node_modules/handlebars/dist/handlebars.runtime.min.js']);

        var templates = gulp.src( templates_source )
            .pipe( gulp_handlebars({
                handlebars: require('handlebars')
            }))
            .pipe( wrap('Handlebars.template(<%= contents %>)') )
            .pipe( declare({
                namespace : 'MyTemplates',
                noRedeclare : true
            }));
    
        var partials = gulp.src( partials_source )
            .pipe( gulp_handlebars({
                handlebars: require('handlebars')
            }))
            .pipe( wrap('Handlebars.registerPartial(<%= processPartialName(file.relative) %>, Handlebars.template(<%= contents %>));', {}, {
                imports: {
                    processPartialName: function(fileName) {
                        return JSON.stringify( path.basename( fileName, '.js').substring(1) );
                    }
                }
            }));
    
        return merge(hr, partials, templates)
            .pipe( concat( 'MyTemplates.templates.js' ) )
            .pipe( htmlclean() )
            .pipe( sourcemaps.init({loadMaps: true}) )
            .pipe( uglify() )
            .pipe( rename( { suffix : '.min' } ) )
            .pipe( sourcemaps.write( './' ) )
            .pipe( gulp.dest( 'js' ) );
    }

    return;
}

Now, I ‘guess’ that templates and partials are ‘somehow’ async. I need to make sure that they are done with whatever they do before they get to the merge part.

What is it about Gulp that I’m completely missing?