how to handle pdf files inside assets?

[lorof]

I encountered an issue where if I import PDF files and try to open them via a link, the service worker prevents it from happening and keeps displaying the application. If I click unregister and refresh the page with the PDF URL, the PDF is displayed.

How can I solve this problem?

[userquin]

The problem with PDF files:

• you don't have them in the sw precaching strategy
• when requesting th epdf file, the service worker will try to find it in the precaching cache, since pdf files are missing the sw will serve the fallback page (html)

You can add the PDF files to the precaching cache or you can exclude them from sw precaching handler:

are PDF files static? if so, you can add them to the sw precache (add pdf extension to includeAssets pwa config option), this way pdf can be downloaded when offline: check https://vite-pwa-org.netlify.app/guide/static-assets.html#static-assets-handling

You can also exclude any pdf from being intercepted by the precaching controller, add pdf extension to workbox.navigateFallbackDenylist (regexp array):

workbox: {
  // <other options>
  navigateFallbackDenylist: [/\.pdf$/],
}

[lorof]

thanks a lot, pdf is static and

workbox: {
  // <other options>
  navigateFallbackDenylist: [/\.pdf$/],
}

was helpful