CSS styles not being applied (Mac)

Using a Mac (OS 10.12.5) and 2.0.4 of Local

CSS style changes from the stylesheet are not being applied. I can see the changes in the Editor if I look (tried editing both in Brackets and in the Editor) however changes not showing on front-end and when inspected do not show up (original style sheet only displays). Styles applied via the functions.php do appear.

I have tried exporting, deleting old site, and re-importing but it did not correct the issue.

In Local’s preferences trying selecting the Developer Mode. I’m not sure if you’ll need to restart the site, can’t hurt.

If it’s related to the new caching option installed with Custom setting.

Initially, the site was not in dev mode because I didn’t realize what that was (personally I cannot understand WHY caching would be enabled by default on a development server… I guess it makes sense if you’re showing it live? but even then I would probably leave it off)

I switched it into dev mode after about an hour and it’s been in dev mode ever since. I didn’t start changing any CSS until after it was in dev mode and I’m still having the same issue. I’ve also tried deleting the site, making sure the default is set to dev, and re-importing it but it is still stuck

My other development site is not having this problem (clean WP install, no changes before turning on dev mode)

Interesting! We’ll keep an eye on this.

Can you try exporting the site and then re-importing it using the “Custom” environment?

I actually tried that - and tried with the preferred environment… no luck! I’m trying just exporting the xml files and importing them to a new site to see if it works

Can you try going to Preferences » Advanced and then disabling “Faster Docker Volumes” if it’s enabled?

Unfortunately, no luck… and the the story is getting weirder.

So I created a totally new site, even gave it a different name. Imported the old content via .xml - able to edit the stylesheet. YAY I think… except then when I imported the widgets via the widget importer exporter plugin… styles stop being updated. I even tried changing the version of the stylesheet. No dice.

In case it matters I’m using Text widgets, Custom Menu widgets, and the Genesis Featured Posts widget.

I have this same issue - the browser is caching the CSS resources - even if you restart the site it will stay cached. Try loading in a new browser to verify this - which is what I did.

I found that if I manually cleared the cache on my browser (Chrome) this seemed to fix it… temporarily anyways. But I used MAMP previously and never had this issue.

There are some .htaccess parameters we can add to bust the browser caching, but if we’re using the default LBF settings they have nginx and you’d need to add a configuration to the specific site config file. I think LBF should have this done for us out of the box since it’s natural to expect localhost sites to be under development.

1 Like

Do you now what I would need to add because I’m getting real tired of having to clear my cache every time I want to see my styles applied. This combined with the huge RAM usage is making me strongly consider switching back to MAMP unfortunately.

Hi @adriannees,

Is the site you’re working on currently “Custom” or “Preferred”? I know you mentioned you tried both earlier but I’m curious to know what the current environment is.

Also, have you tried holding shift when you refresh your site?

I haven’t dived into the settings yet to check - but @clay - is LbF turning off caching from within NGINX and APACHE configs?

Also @adriannees - I haven’t tried this to confirm, but perhaps it will help https://stackoverflow.com/questions/11532636/how-to-prevent-http-file-caching-in-apache-httpd-mamp

Enabling “Dev Mode” on the Preferred environment disables Varnish caching only.

If assets are being cached by the browser then I would recommend just holding Shfit when Cmd + R-ing to refresh. The shift will make it a hard refresh.

You can also disable caching in your developer tools.

Those .htaccess snippets might work as long as you’re using a Custom environment and Apache.

1 Like

I’m currently in a custom environment - I matched it to their preferred host’s configuration. The hard refresh seems to work, though as I’ve said previously I didn’t have this issue with MAMP so I wish there was a setting within the software to correct this.

@adriannees,

Please see https://stackoverflow.com/questions/5690269/disabling-chrome-cache-for-website-development

I tried expires off; in the nginx config but Chrome was still aggressively caching it. The trick above does the job :slight_smile:

Thanks man. This worked for me.