Gulp, BrowserSync, Node, and Nodemon all working in harmony. ;)

app.js

/**
 * World's simplest express server
 * - used to serve index.html from /public
 */

var express = require('express');
var serveStatic = require('serve-static');
var app = express();

app.use(serveStatic(__dirname + '/public'));

app.listen(3000);
console.log('Express listening on port 3000');

gulpfile.js

/**
 * Module Dependencies
 */

var gulp = require('gulp');
var browserSync = require('browser-sync');
var reload = browserSync.reload;
var nodemon = require('gulp-nodemon');

/**
 * Gulp Tasks
 */

gulp.task('browser-sync', ['nodemon'], function() {
  browserSync({
    proxy: "localhost:3000",  // local node app address
    port: 5000,  // use *different* port than above
    notify: true
  });
});

gulp.task('nodemon', function (cb) {
  var called = false;
  return nodemon({
    script: 'app.js',
    ignore: [
      'gulpfile.js',
      'node_modules/'
    ]
  })
  .on('start', function () {
    if (!called) {
      called = true;
      cb();
    }
  })
  .on('restart', function () {
    setTimeout(function () {
      reload({ stream: false });
    }, 1000);
  });
});

gulp.task('default', ['browser-sync'], function () {
  gulp.watch(['public/*.html'], reload);
});

package.json

{
  "private": true,
  "dependencies": {
    "express": "^4.5.1",
    "serve-static": "^1.3.0"
  },
  "devDependencies": {
    "browser-sync": "^1.2.1",
    "gulp": "^3.8.6",
    "gulp-nodemon": "^1.0.4"
  }
}

I have used the same code, but my first page which is named as 'main.jade' is not being rendering. But when I am going to other url's like /dasboard it opens correctly. Should I name my starting file name as index.jade, will that help

Thanks bro.work fine

`

/**

• Module Dependencies
  */

var gulp = require('gulp');
var browserSync = require('browser-sync');
var reload = browserSync.reload;
var nodemon = require('gulp-nodemon');

/**

• Gulp Tasks
  */

gulp.task('nodemon', function (cb) {
var called = false;
return nodemon({
script: './bin/www',
ignore: [
'gulpfile.js',
'node_modules/'
]
})
.on('start', function () {
if (!called) {
called = true;
cb();
}
})
.on('restart', function () {
setTimeout(function () {
reload({ stream: false });
}, 1000);
});
});

gulp.task('browser-sync', gulp.series('nodemon', function() {
browserSync({
proxy: "localhost:3000", // local node app address
port: 5000, // use different port than above
notify: true
});
}));

gulp.task('default', gulp.series('browser-sync', function () {
gulp.watch(['public/*.html'], reload);
}));
`

I dont know how to format the code here. This works in gulp 4.0 and up

This did the trick for me on gulp 4.0.2:

'use strict';

var gulp = require('gulp');
var browserSync = require('browser-sync');
var nodemon = require('gulp-nodemon');

gulp.task('nodemon', function (cb) {
	
    var started = false;
	
    return nodemon({
        script: 'server.js',
        ignore: [
            'gulpfile.js',
            'node_modules/'
            ]
	}).on('start', function () {
		if (!started) {
			cb();
			started = true; 
		} 
	});
});


gulp.task('browser-sync', gulp.series('nodemon', function() {
    browserSync.init(null, {
        proxy: "http://localhost:3000",
        files: ["public/*.html"],
        port: 5000,
    });
}));

gulp.task('default', gulp.series('browser-sync', function () {
}));

Code adapted from: https://gist.github.com/sogko/b53d33d4f3b40d3b4b2e and @alaksandarjesus