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

[PWA] /img/icons cache? #2975

Closed
frizar opened this issue Nov 18, 2018 · 6 comments
Closed

[PWA] /img/icons cache? #2975

frizar opened this issue Nov 18, 2018 · 6 comments

Comments

@frizar
Copy link

frizar commented Nov 18, 2018

Version

3.1.1

Reproduction link

https://test-app-8134f.firebaseapp.com/

Node and OS info

node 10.13.0, npm 6.4.1, macOS 10.14, windows 10

Steps to reproduce

Im new in PWA plugin, so i have a question. Is "/img/icons" folder not cached by service worker by default and why?
I created new app with PWA option, deploy it to firebase and i see that any files from "/img/icons" not cached...
https://test-app-8134f.firebaseapp.com/ this is my result. Open dev console, enable Offline mode, reload page.
Screenshot: http://joxi.ru/52aR4oxSE4j1YA
Same problem with manifest.json. It is correct behavior?

What is expected?

Any files from public folder should be cached by default

What is actually happening?

/img/icons folder not cached, also manifest.json not cached


Please tell me if im wrong and explain me why this happens and how to fix(?) it.
Thanks! Sorry for my English, btw.

@haoqunjiang
Copy link
Member

Because icons are excluded in the default workbox settings:

const defaultOptions = {
exclude: [
/\.map$/,
/img\/icons\//,
/favicon\.ico$/,
/manifest\.json$/
]
}

#769 (comment)

The request that a browser makes for either a registered favicon or for the home screen icon bypasses the service worker, so there's no benefit from caching them.

manifest.json was excluded as we followed workbox's default config. (They'll change the behavior in the upcoming v4, though. GoogleChrome/workbox#1679)

These default options can be overridden by configuring the pwa.workboxOptions field in vue.config.js. https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa#configuration

@frizar
Copy link
Author

frizar commented Nov 20, 2018

@sodatea oh, thank you very much! ❤️

@troncoso
Copy link

I'm looking into this exact issue, and while I understand the default configuration excludes these, it would be nice to know the correct way to ensure the home screen icon/favicon are properly cached so they can display in offline mode. Is there any insight on that? This issue is nearly a year and a half old, so maybe some things have changed?

@ninest
Copy link

ninest commented May 28, 2020

@troncoso I believe you can check this in the chrome dev tools. Go to offline mode, and you'll see that the icons are still there.

The problem I'm facing though, is that the icons aren't getting updated. The browser is still using the same icons from the cache

@troncoso
Copy link

@ninest Yes, I see the icons there, but when running in offline mode, the browser tab stops showing the favicon.

@ninest
Copy link

ninest commented May 28, 2020

@troncoso so for you, the PWA is working offline, but only the icons won't show?

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

No branches or pull requests

4 participants