Why does browsersync only work on localhost:3000, and not on custom url bedrock.dev:3000 (through Vagrant)

trellis
1

I’m experimenting for the first time with the full Roots stack (Trellis / Bedrock / Sage). I got a project set up and everything works as I expected.

When running the local machine with Vagrant localhost:3000 works, localhost:3001 works, browsersync works. Browsersync is not working on bedrock.dev, although the page is accessible on bedrock.dev.

I’d like browsersync to work on my dev url (bedrock.dev, or bedrock.dev:3000 - bedrock.dev:3000 is not accessible) as well. I understand this might not be default behaviour, but can it be achieved?

gulpfile.js watch task

gulp.task('watch', function() {
  browserSync.init({
    files: ['{lib,templates}/**/*.php', '*.php'],
    proxy: config.devUrl,
    logPrefix: config.devUrl,
    open: false,
    notify: true,
    ghost: false,
    snippetOptions: {
      whitelist: ['/wp-admin/admin-ajax.php'],
      blacklist: ['/wp-admin/**'],
    
    }
  });
  gulp.watch([path.source + 'styles/**/*'], ['styles']);
  gulp.watch([path.source + 'scripts/**/*'], ['jshint', 'scripts']);
  gulp.watch([path.source + 'fonts/**/*'], ['fonts']);
  gulp.watch([path.source + 'images/**/*'], ['images']);
  gulp.watch(['bower.json', 'assets/manifest.json'], ['build']);
});

gulp watch output

[code][bedrock.dev] Proxying: http://bedrock.dev
[bedrock.dev] Access URLs:

   Local: http://localhost:3000
External: http://172.16.12.127:3000

      UI: http://localhost:3001

UI External: http://172.16.12.127:3001

[bedrock.dev] Watching files…[/code]

/etc/hosts entry (vagrant is running @ 192.168.50.5)

[code]## vagrant-hostmanager-start id: 80666064-0f8c-4006-96b7-84791965dab6
192.168.50.5 bedrock.dev
192.168.50.5 www.bedrock.dev

vagrant-hostmanager-end[/code]

2

There’s a thread on this in the BrowserSync repo and it looks like this comment might be what you’re after?

3

I tried adding the devUrl to the host option of browsersync but unfortunately browsersync still doesn’t work on the devUrl (and bedrock.dev:3000 is still unreachable).

Came across that source, and almost al sources around on this subject but to no avail yet!

4

@kasperientje, you need to start yarn from within the vvv, that way, the :3000 port is accessible to your browser ( domain.dev:3000 )