vite-pwa / vite-plugin-pwa

Zero-config PWA for Vite
https://vite-pwa-org.netlify.app/
MIT License
2.84k stars 192 forks source link

no SW.js when registerSW() function is in pwa.js file with particular import manner #694

Open EKliptus opened 1 month ago

EKliptus commented 1 month ago

See this repository to reproduce : https://gitlab.com/ekliptus49/vite-plugin-pwa-astro-minimal-sw-issue See minimum this file : https://gitlab.com/ekliptus49/vite-plugin-pwa-astro-minimal-sw-issue/-/blob/master/src/pages/index.astro

pnpm build do not generate SW.js (and workbox-x.js) when registerSW() function is in pwa.js that was conditionally (true) import in html. like this : { true && <script src="/src/pwa.ts"></script> } in index.astro file

I guess vite-plugin-pwa try to determine if the registerSW() was triggered before generate SW. And the conditionnal html script import in {...} isn't follow.. ?

I don't have found any " registerSW() triggered flag " on vite-plugin-pwa source code.

Why registerSW() call is needed to generate SW.js with genrateSW strategie ???

EKliptus commented 1 month ago

I guess the problem is with Astro... The script tag and the ts source script /src/pwa.ts is not process as imported ts file by Astro. TS script import in the {...} is considering as it is. So the app (console) search for a http://localhost:4321/src/scripts/pwa.ts that not exist...

With <script src="/src/pwa.ts"></script> in index.astro file : astro process and bundle the script. It is not a problem with vite-plugin-pwa, but if anyone has a solution to conditionally import a script in an Astro file ? I need it ...

Thanks

userquin commented 1 month ago

Why do you need to include the script this way? if you disable the pwa, the astro pwa integration will create a dummy virtual module.

EKliptus commented 1 month ago

Why do you need to include the script this way? if you disable the pwa, the astro pwa integration will create a dummy virtual module.

Because when I want to disable the PWA integration I don't want anything in the build that related to pwa integration... And when PWA integration is disabled and when load with Githubissues.

  • Githubissues is a development platform for aggregating issues.