CSS Not Refreshing

I am running a site in Flywheel Local 3.2.1 and my CSS is not updating. HTML elements will update, but I cannot get the CSS to update quickly. I’ve tried clearing browser cache, and I’ve tried other browsers. I can see fast changes here and there if I enter CSS changes into my theme’s “Quick CSS” box, but that is very spotty as well. The only way to get it to work is if I stop the site, quit the browser, and restart everything.

I am using Mac High Sierra 10.13.6. I am hoping there is a good solution to this? It is beyond frustrating…

Thank you!

Hey @tonyremco

Can you describe in a little more detail what the work flow is?

For example, is this a theme that is being built with some sort of pre-compiler like Webpack, or Gulp/Grunt?

You mention that using the “Quick CSS” box works a bit more reliably than other methods. What file(s) are being used for the styles? Are the style rules specific enough?

I am using Wordpress, a theme called Enfold.

I have set up a child theme and I am accustomed to making all the CSS changes in that using the styles.css

It has a Quick CSS box in the theme dashboard which I normally don’t use.

I am fairly certain the styles are specific enough, I use pretty much the same templates for all my sites and have never run into this problem until I started using Local by Flywheel.

Also, as I believe I said earlier, if I quit and restart everything, the changes take hold, so I have a feeling it is not the CSS itself but some kind of caching issue within Flywheel.

Thanks for the response and for your help!!!

Tony

It sounds like you’re on the right track for testing and debugging things.

A few other things for you to explore:

  • What environment is it? Preferred/Custom?
  • If custom, what versions of software?
  • The current version of Local has a “Dev Mode” which disables the varnish layer:
    • image

If enabling Dev Mode doesn’t help, then maybe there’s something related to the way that the VirtualBox is mounting the files into the Virtual Machine. Can you try toggling “Faster Docker Volumes” from the “Advanced” tab of the “Preferences” page?

Whatever the default mode is, I assume it’s Preferred? I have not set up a custom mode as far as I am aware.

I have switched Dev Mode on and off, I have read some troubleshooting articles regarding this. No changes.

I will try the faster docker volumes and report back.

Thanks again!

Hi Ben

Now that I’m back in front of my home computer, I realize I had toggled that faster docker volume button on and off while troubleshooting, way back when…:slight_smile: I had pretty much turned on and off every possible configuration in Local at one point or another!

It didn’t have an effect on the CSS updating. The only thing that worked was quitting and rebooting everything.

If you have any suggestions I would greatly appreciate your help, I am starting on a new site and I would love to resolve this issue. I’ll pay for premium support if I have to, Flywheel is a great tool if I can just get rid of this problem…:slight_smile:

FYI I am using Local 3.2.1, I don’t know if that is helpful. Thanks again!

Tony

OK new wrinkle: my bad. I did set this up as a custom, completely forgot that I did that in the time between posting this support request and receiving your response.

Custom settings: Custom 1.3.2
Web server nginx
PHP 5.6.20
MySQL 5.5.60
Wordpress 5.2.2

Sorry about that! Again, it was a while since I posted the request and I wasn’t in front of my development mac when I was responding, but now I am. Hope this helps!

No worries @tonyremco!

One thing you might try as a troubleshooting step is to clone the “Custom” site to a “Preferred” one, and then ensure that “Dev Mode” is enabled.

You can clone a site by right-clicking on the site and selecting “Clone”, which will export the db and re-import the db and files into a new Local site.

One other thing to try is to try disabling the cache within the browser’s developer tools. Here’s how to do that in Chrome:

Options > More Tools > Developer Tools > Network Tab > Disable Cache

Other browsers have similar things, and I’ve found that leaving that open with the “Disable Cache” setting checked does a pretty good job of keeping things fresh!