proxy not working with gulp

When I run browser-sync with gulp it says it is proxying my server but it launches my site on the the same port. However when I manually start browser-sync, I get the expected behavior.

Here is my gupfile

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

var watchFiles = ['./views/**/*', './public/**/*'];

gulp.task('browser-sync', function() {
    browserSync.init(null, {
        proxy: "localhost:3000"
    });
});

gulp.task('watch', ['browser-sync'], function () {
  gulp.watch(watchFiles, reload);
});

gulp.task('default', ['watch']);

[sogko]

I recently had the same issue and in my case, I found out that my application is running at port 3000. same port for browser-sync by default

@makenova I noticed that your proxy is localhost:3000, try the following config to specify a different port for browser-sync to use

gulp.task('browser-sync', function() {
    browserSync({
        proxy: "localhost:3000",
        port: 4000 // specify a different port for browser-sync, default is 3000
    });
});

[shakyShane]

@makenova - BrowserSync just checks for an available port at run time, so it sounds like it’s losing in a race condition.

This is exactly what the port option is for, thanks to @sogko for pointing that out

😃