Trouble with BrowserSync and "devUrl"

Hey guys,
I’m having a problem with getting BrowserSync to use the devUrl as a proxy, and it’s a weird problem.

I have the devUrl set like it should be… (I can access the site with this url so I know it’s correct)

But when I run gulp watch I get this…

It chops off everything after localhost and adds it to the access url, and it doesn’t load the site.
I’ve tried every variation I can think of to get it to work, even adding the port number to the devUrl (localhost:80/bedrock/web) just makes it chop off at localhost:80 instead.

Am I missing something obvious? Any idea what the problem might be?


If you’re using MAMP for bedrock you can try using http://localhost:8888/ for the devurl. Without anything after. Also check if that url works and loads your site. Your Mamp source should be ‘web’ but you shouldn’t see that in the url anywhere.

You will be using the sage localhost:3000 just for viewing changes you male etc. but you will still use the localhost:8888 for wp-admin.

It can be a bit confusing with the localhost everywhere, but :3000 is just a proxy view of your site with sage tools.

Thanks for the reply,
I’m not using MAMP, I’m using my mac’s native apache and php installations with mysql.
It’s strange because when I go to localhost/ the server is running, and the wordpress installation is working fine.

// An hour later

Ok so I fixed it, thanks in part to your advice and some trial and error.
So I was playing around with apache’s httpd.conf file, and I set the DocumentRoot and <Directory "/#"> to point to the ‘web’ folder. This set http://localhost:80/ to go directly to the wordpress installation.

Then in bedrock’s .env file -
WP_HOME=http://localhost WP_SITEURL=http://localhost/wp

… and in the manifest.json
"devUrl": "http://localhost:80/"

Now browserSync loads the site and works as expected, not sure if there was more to it, and it’s not the most elegant solution, but for now I’m happy.