Browsersync within a Docker container
The primary problem with your configuration is that you're pointing to localhost
in the gulpfile. This points to the local container, not your host machine, so browsersync won't be able to connect to Wordpress.
You first need to update the gulpfile to point to the wordpress
service, on its internal port:
browserSync.init(files, { // The hostname is the name of your service in docker-compose.yml. // The port is what's defined in your Dockerfile. proxy: "wordpress:3000", notify: false, // Do not open browser on start open: false})
Then you need to add a port mapping to expose the browsersync server from your node
service. In your docker-compose.yml
file:
node: ports: - "3000:3000" - "3001:3001"
You should now be able to access the browsersync proxy on localhost:3001
.
P.S. In case you have more than one site serving in one ngninx docker container, you can edit nginx config file for specific site in /etc/nginx/conf.d/somesite.conf and add new line:listen: 3000;