Local site isn't displaying CSS unless stylesheet is saved

Support
,
1

Hi,

I recently installed Local on my work laptop in order to do some development work for our new website. Local is all set up and running fine locally and I have a site set up and I’m working on our wordpress templates. The issue I’m having, however, is that local won’t display the styles on the site unless I save the stylesheet while running in “Instant Reload” mode. If I load up the site or refresh the page I’m on then the styles won’t show until I save one of the stylesheets - even if no changes have been made. This is frustrating and also causing elements of the page layouts to break.

Any idea why the stylesheets don’t want to show until I save a stylesheet file? This isn’t the only site it won’t work on either - it’s all sites in Local. Also, if I turn off “Instant Reload” mode then the styles just won’t display at all.

This is happening on the follow device:

Device name N010
Full device name N010.xxx.LOCAL
Processor 11th Gen Intel(R) Core™ i7-11370H @ 3.30GHz 3.30 GHz
Installed RAM 16.0 GB (15.7 GB usable)
Device ID 1AFA2EFF-D45C-4192-B7F7-29E468CE2213
Product ID 00330-80000-00000-AA858
System type 64-bit operating system, x64-based processor
Pen and touch No pen or touch input is available for this display

And the following version of Windows:

Edition Windows 10 Pro
Version 22H2
Installed on ‎02/‎09/‎21
OS build 19045.2965
Experience Windows Feature Experience Pack 1000.19041.1000.0

I also have the Local logs if you need them.

Any help you can give would be appreciated because it’s making the development of the site rather laborious at the moment rather than easier.

Thanks!

2

Hi @mattrosebcc

What kind of theme and plugin configuration do you have? Are you using any specific builders?

3

It’s a theme I’m building myself using Underscores as a base and I’m not using any builders. I’ve a small handful of plugins installed:

  • Admin Columns
  • Advanced Custom Fields
  • Advanced Custom Fields: Font Awesome
  • Export Media with Selected Content
  • Max Mega Menu
  • Post Type Switcher
  • Relevanssi
  • Relevanssi Ajax Search
  • Wordpress Importer

That’s it. I’m trying not to install too many plugins to keep the theme lightweight.

4

Hello. Were there any thoughts on this? I’ve also got a problem that sometimes if I refresh a page, the page source reverts to earlier code and I have to close the tab and reopen the URL to display the most up-to-date code. It’s very frustrating. Is there some sort of caching issue with Local?

5

Hi there @mattrosebcc -

I’m thinking there is a caching issue going on here, but it doesn’t sound Local-specific.

Is this a child theme?

When you set up your stylesheet for your CSS did you add a version number or are you adding it via functions.php with the wp_enqueue_style function?

Sam

6

Hi @sambrockway. This isn’t a child theme, no, it’s a theme I’m developing for my employer’s new website. It uses the Underscores starter theme as a base, but I’m modifying it heavily.

I do have a version on the styles, but that doesn’t seem to make any difference with or without it. Sometimes Local won’t even load the correct version of the PHP templates I’ve coded and I’ll have to close the tab and reopen it to show the correct version. So I’m a bit stumped as to why it’s doing this.

Thanks.

7

Actually, one thing I have notice is the following error in the console. Do you think this might be related?

WebSocket connection to 'ws://bcc.local/browser-sync/socket.io/?EIO=3&transport=websocket&sid=xl_H1aIwuzQcGbDwAAHl' failed:     browser-sync-client.js?v=2.27.0
1 Like
8

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.