gulp with less and browser-sync

Question

I am just starting with gulp and following this example: css tricks - Gulp for Beginners

   'gulp less'  works fine
   'gulp browser-sync' loads index.html into chrome

but when I run the 'watch' command, it only runs 'browser-sync. Following in the debugger shows it does not return from browserSync.init

What am I missing?

` var gulp = require( 'gulp' ), less = require( 'gulp-less' ), browserSync = require( 'browser-sync' ).create() ;

            gulp.task( 'less', _=>{
                return gulp.src( './public/content/*.less' )
                              .pipe( less( { paths: ['public/content'] } ) )
                              .pipe( gulp.dest( './public/content' ) )
                              .pipe( browserSync.reload( { stream: true } ) )
                      ;
            } );

            gulp.task( 'browser-sync', _=>{
                browserSync.init( { server: { baseDir: './public' } } );
            } );

            gulp.task( 'watch', ['browser-sync'], _=>{
                gulp.watch( 'public/content/*.less', ['less'] );
            } );

`

Answer 1

Found it.

    `return browserSync` 

did the trick. This is not the way the demo was written.