Trying to make browsersync work within vagrant using gulp

user_2500177 0
Viewed 99

I've been stuck in trying to make browsersync work within vagrant using gulp. I can connect to the UI of browsersync but I can never connect to my development site. If tried connecting using the address http://localhost:3000, I keep getting the error below:

Cannot GET /

Here are my configurations for vagrant: 

  # IP Address to access the server 10.0.0.3
  config.vm.network "private_network", ip: "10.0.0.3"
  config.vm.network "forwarded_port", guest: 3000, host: 3000, auto_correct: true
  config.vm.network "forwarded_port", guest: 3001, host: 3001, auto_correct: true

  # Sync the server timezone to the host machine
  config.vm.provision :shell, :inline => "sudo rm /etc/localtime && sudo ln -s /usr/share/zoneinfo/Asia/Manila /etc/localtime", run: "always"

  # Sync File
  config.vm.synced_folder "./", "/var/www/html", mount_options: ["dmode=777", "fmode=666"]

Configuration when connecting to SQL

enter image description here

Here are my configurations for Gulp:

browserSync.init(["./assets/css/*.css"],{
    server: {
        proxy: "http://10.0.0.3/globe-gui/",
        open: false,
        port: "2222",
        injectChanges: true,
    }
});

enter image description here

I tried searching the net for a solution but can't seem to get an answer.

vagrant gulp browser-sync
1 Answers

Browser sync isn't initialized with the correct options.

browserSync.init({
    files: ["./assets/css/*.css"],
    open: false,
    port: "2222",
    injectChanges: true,
    proxy: "http://10.0.0.3/globe-gui/",   
});

Your Vagrantfile configures guest machine (box) to be accessible via IP address 10.0.0.3.

Connect to services running in the box from host through IP address (10.0.0.3).

Set the SSH Host to 10.0.0.3 for a database service running on port 2222 in the box when connecting from host to box, but set localhost when connecting inside of the box.

I take it that BrowserSync is started inside the box.

Configure proxy to have value:

proxy: "http://localhost/globe-gui/",

Connect to BrowserSync from a browser running in the host through private IP address for box (http://10.0.0.3:3000).

user_51898110
Related