Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

if CSS changes aren't showing up, clear Chrome's cache #23

Open
kreinholz opened this issue Mar 15, 2020 · 2 comments
Open

if CSS changes aren't showing up, clear Chrome's cache #23

kreinholz opened this issue Mar 15, 2020 · 2 comments
Labels
tip

Comments

@kreinholz
Copy link

@kreinholz kreinholz commented Mar 15, 2020

This is a tip in case, like me, you've been playing around with your p2 CSS but Chrome isn't displaying those changes.

Go to Chrome > Settings > Privacy and security > Clear browsing data, and then check the box for "Cached images and files." Change the Time range as needed (in my case I just did "Last 24 hours.")

Hit "Clear data" and when you refresh your p2 page, your new CSS rules should be applied.

The reason why this happens is that certain files like your public CSS file gets stored in Chrome's browser cache in order to speed up your web browsing experience. Great for everyday Internet usage, but not so great for testing the look of CSS rule changes while developing a web app. Hope this helps!

@susanBuck susanBuck added the tip label Mar 16, 2020
@susanBuck

This comment has been minimized.

Copy link
Owner

@susanBuck susanBuck commented Mar 16, 2020

Good tips!

Piggy-backing on this, if you look in your browser's dev tools settings, there's an option to disable cache while the dev tools panel is open (screenshot below). This can be useful when doing CSS related development work.

Alternatively, there are keyboard shortcuts to do a "hard refresh" in the browser - that's a refresh plus a cache clear:

On Mac, it's cmd + shift + R
On Windows, it's ctrl + shift + R

image

@janenycxo

This comment has been minimized.

Copy link

@janenycxo janenycxo commented Mar 22, 2020

Good tips!

Piggy-backing on this, if you look in your browser's dev tools settings, there's an option to disable cache while the dev tools panel is open (screenshot below). This can be useful when doing CSS related development work.

Alternatively, there are keyboard shortcuts to do a "hard refresh" in the browser - that's a refresh plus a cache clear:

On Mac, it's cmd + shift + R
On Windows, it's ctrl + shift + R

image

neat, i just tried this and it reflected my updated css styles!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants
You can’t perform that action at this time.