At first, when I saw in the Chrome Developer console that my CSS file was not updating, I thought it was a problem with my text editor. So I switched from VSCode to Sublime 3 and encountered the same error. It had updated slightly, but not much. So after a while I swithced again to Atom, and still encountered the same problem. I even switched my Webserver from MAMP for Windows to XAMPP. Still no dice. When I say updating, I mean the file would save, but the changes wouldn't appear in my browser.
Asked
Active
Viewed 179 times
-2
-
what are you using as a server? e.g. apache on your local machine, nginx on a remote managed host, etc – danyamachine Jun 25 '17 at 17:28
-
You can blame caching. – Funk Forty Niner Jun 25 '17 at 17:29
-
are you doing a "hard refresh"? If you simply refresh the page, the browser may be using a cached version of some assets. – danyamachine Jun 25 '17 at 17:29
-
This is cache related. To fix it, add a version number behind your .css url. Like so: – Gerard Jun 25 '17 at 17:30
-
@Gerard Yes but then that would also keep caching `v` as `1` Best to use a timed method. – Funk Forty Niner Jun 25 '17 at 17:31
-
@danyamachine I am using XAMPP to locally host apache – Bryan Bergo Jun 25 '17 at 17:58
1 Answers
-3
This is the issue with browser caching, and clearing it every time you update your CSS isn't a viable solution.
You can either go the short route and open your website in incognito mode. This will clear cache each time you revisit the page.
I recommend you disable caching for your website while working on it. I assue you're running Apache on your server, and then it's simply a matter of including this tag in your .htaccess file.
<IfModule mod_headers.c>
Header set Cache-Control "no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires 0
</IfModule>
or this snippet in your HTML <head>
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
Follow these instruction for a more in-depth implementation How to control web page caching, across all browsers?
Victor Westerlund
- 100
- 11
Sethumadhavan K
- 83
- 6