How do I use vagrant and browsersync with local domain?

Question

I use vagrant and I have it configured to update my etc/host file here's an example.

10.20.1.36  example.dev

I can then access the VM's apache server with http://example.dev/

I want to use browsersync from the command line but I haven't been able to access my site. I have browsersync installed on my mac host and in the vagrant VM. I've tried it from my mac and the VM using the following command but it doesn't work in either environment.

browser-sync start --proxy "example.dev" --files "public/*.html,public/css/*.css,public/js/*.js"

Here's what I get from the Mac

[BS] Proxying: http://example.dev
[BS] Access URLs:
 -------------------------------------
   Local: http://localhost:3000
External: http://192.168.0.10:3000
 -------------------------------------
      UI: http://localhost:3001
 UI External: http://192.168.0.10:3001
 -------------------------------------
[BS] Watching files...

And here is what happens in the VM

[BS] Proxying: http://example.dev
[BS] Now you can access your site through the following addresses:
[BS] Local URL: http://localhost:3000
[BS] External URL: http://10.0.2.15:3000
[BS] Watching files...

When I run it in the mac I'm able to access the browsersync ui at http://localhost:3001/ but not my website.

I'm unsure as to where I should run it. How I should access the site in my browser. If I need to forward any ports in my VM.

Searching the web returns a lot of results but they're all about grunt or gulp and I don't use either of them.

EDIT: I added port forwarding to vagrant and then I launch browser-sync from within the vm. Everything works now at http://example.dev:3000 and http://example.dev:3001.

Here's what I added to my Vagrantfile: config.vm.network :forwarded_port, guest: 3000, host: 3000, auto_correct: true config.vm.network :forwarded_port, guest: 3001, host: 3001, auto_correct: true

Answer 1

Here's how I got it working.

I added port forwarding to vagrant and then I launch browser-sync from within the vm. Everything works now at http://example.dev:3000 and http://example.dev:3001.

Here's what I added to my Vagrantfile: config.vm.network :forwarded_port, guest: 3000, host: 3000, auto_correct: true config.vm.network :forwarded_port, guest: 3001, host: 3001, auto_correct: true