I’m currently having a bothersome issue with assets and browsersync when running the project through docker containers. I’ll outline my setup in the hope of finding out what exactly could be going wrong with sage:
A bash script I have creates the composer bedrock project
I add my dependencies through composer, install the sage theme etc - standard setup
This is where things get fishy: I then create docker containers for nginx, mysql and memcached
I’m on OSX so the nginx container has an IP address from the VM docker uses, and I point project.dev to that ip address simply through hosts file, nothing fancy like bind or dnsmasq
After these steps I can successfully reach project.dev - I can install wordpress in the database and run npm install && bower install in the sage theme directory.
All seems good: I’m running the project on IP 192.168.1.105 and project.dev points to 192.168.1.105
Once all this is done, I run gulp watch to start hacking on the theme, but while the dist files on the filesystem actually DO update successfully when I edit .less source files, the dist versions in the browser do not.
the file contents I see in the browser do NOT match the contents I see when opening that same file with my editor.
I try opening the same file with different browsers, with curl and wget commands, but the result of this get request remains the outdated css file.
Any changes I do in .less or .sass seems to works fine and it updates the /dist files, but for some reason the server is stuck on the first version it gets to see.
I tried running a more vanilla setup, i.e. setting up apache on my host machine, and browsersync works just fine with that approach, so this has something to do with the docker setup.
Does anyone have any insight to share as to why this could be happening? Is having the proxied domain point to an address other than 127.0.0.1 a known issue?
I’ve tried researching this before opening this thread but I’ve come back empty handed.
Thanks to anyone who will try to help out with this.
Yeah I figured this wouldn’t really qualify as a sage issue given that files are updates, but I thought it could be related to browsersync.
I’m really out of ideas as to what could be causing the issue. I tried fishing for issues within the nginx docker container, which is also the one that mounts the filesystem inside the nginx www directory, but even while browsing the container itself, the files were clearly available in their latest version.
I’ll definitely bring this up in the docker-dev group as well in the hopes of finding more informations. I’ve read a few threads about interest in docker here so I’m sure knowing about any issues with bedrock/sage and a standard docker setup would be helpful to some.
You say you’re visiting project.dev, but in the Sage gulp file by default, your browser should automatically open to localhost:3000 which proxies to project.dev if you’ve set it up correctly, IE. changed the devUrl in assets/manifest.json
Going directly to project.dev will not use Browsersync.
As for your outdated CSS being kept, sounds like a cache issue with your Docker setup perhaps?
I’ve figured this out and I’m posting the issue to whoever may encounter something similar.
This has nothing to do with sage as foretold by benword earlier in the thread.
Apparently using a VM (or docker on an environment which still requires a light linux VM) with nginx “sendfile” turned on can result in outdated static files being sent.
Apache has the same issue with a parameter that is the nginx sendfile equivalent.
You’re likely to encounter this issue if your dev stack includes either docker, vagrant, or anything else that requires a VM and nfs mounted directories.