vite-pwa / vite-plugin-pwa

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

Module not found after uniapp build as h5 version #636

Open censujiang opened 10 months ago

censujiang commented 10 months ago

Error report details

Uncaught (in promise) TypeError: Failed to resolve module specifier '..-node_modules-.pnpm-workbox-window@7.0.0-node_modules-workbox-window-build-workbox-window.prod.es5.1e1a3f8e.js'
    at index-487d5823.js:6:86496
    at t (index-487d5823.js:1:762)
    at index-487d5823.js:6:86489
    at u.immediate (index-487d5823.js:6:86942)
    at jh (index-487d5823.js:6:86968)
    at index-487d5823.js:6:87685
    at Dn (index-487d5823.js:1:19096)
    at Un (index-487d5823.js:1:19174)
    at t.__weh.t.__weh (index-487d5823.js:1:33192)
    at Y (index-487d5823.js:1:4319)

Reproduction example

https://github.com/censujiang/vite-plugin-pwa-with-uniapp-test https://stackblitz.com/github/censujiang/vite-plugin-pwa-with-uniapp-test

Reproduction method

In the provided sample project, execute the commands in order, and you can find the problem and report the error in the opened browser window.

pnpm i
pnpm run build
pnpm run preview
userquin commented 10 months ago

add workbox-window to your dev dependencies

censujiang commented 10 months ago

add workbox-window to your dev dependencies

I tried it, but the problem remains. The latest modifications have been submitted to the sample repository.

userquin commented 10 months ago

Try using dynamic import inside launch instead static import here: https://github.com/censujiang/vite-plugin-pwa-with-uniapp-test/blob/main/src/App.vue#L4C53-L4C56

Why are you registering the sw twice (the virtual will register the sw: https://github.com/censujiang/vite-plugin-pwa-with-uniapp-test/blob/main/src/App.vue#L8)?

Anyway, I haven't checked what's doing onLaunch, you should only call pwa virtual on client side: https://vite-pwa-org.netlify.app/guide/faq.html#vite-pwa-virtual-module

censujiang commented 10 months ago
  1. I will try it.
  2. You mean I just need to register manually and set the relevant options?
  3. onLaunch is a function triggered when starting in the life cycle of uniapp
userquin commented 10 months ago

You mean I just need to register manually and set the relevant options?

Remove virtual pwa call (and static import) and register the sw yourself: https://vite-pwa-org.netlify.app/guide/service-worker-without-pwa-capabilities.html#registering-of-the-service-worker-in-your-app

censujiang commented 10 months ago

Regarding question 1, this method is useless. The specific error is as follows

TypeError: Failed to resolve module specifier '..-..-..-..-@vite-plugin-pwa-virtual:pwa-register-vue.eca0a462.js'
    at index-14fb415a.js:6:86683
    at t (index-14fb415a.js:1:762)
    at index-14fb415a.js:6:86676
    at Dn (index-14fb415a.js:1:19096)
    at Un (index-14fb415a.js:1:19174)
    at t.__weh.t.__weh (index-14fb415a.js:1:33192)
    at Y (index-14fb415a.js:1:4319)
    at n (index-14fb415a.js:6:87275)
censujiang commented 10 months ago

You mean I just need to register manually and set the relevant options?

Remove virtual pwa call (and static import) and register the sw yourself: https://vite-pwa-org.netlify.app/guide/service-worker-without-pwa-capabilities.html#registering-of-the-service-worker-in-your-app

This method is currently valid in HTTPS connections with valid SSL certificates, which means that currently for uniapp, we can only register and manage it manually?

userquin commented 10 months ago

Weird, this is the code in the entry point:

        const {useRegisterSW: e} = await t((()=>import("..-..-..-..-@vite-plugin-pwa-virtual:pwa-register-vue.911fca92.js")), [], import.meta.url);
userquin commented 10 months ago

Using your SB playground and registering the sw manually seems to work: https://stackblitz.com/edit/github-rzyq4b?file=src%2FApp.vue

censujiang commented 10 months ago

Weird, this is the code in the entry point:

       const {useRegisterSW: e} = await t((()=>import("..-..-..-..-@vite-plugin-pwa-virtual:pwa-register-vue.911fca92.js")), [], import.meta.url);

Yes, I also feel very strange. Do you think it is a problem with your automatic registration strategy, Vite's packaging problem, or a problem with uniapp itself?

userquin commented 10 months ago

No idea, I'll check your repo later on my local

censujiang commented 10 months ago

Latest news: My friend gave me feedback that there was no problem with the 0.12.3 version of the plug-in used in his project, but the situation I reported appeared when he switched to 0.12.8 and later versions. image image

userquin commented 10 months ago

I tried on my local using latest next version (3.0.0-alpha-4000020231227002) but still not working, enabling Vite log (logLevel: 'info') same result, ..-..-..-..-@vite-plugin-pwa-virtual:pwa-register-vue.20ccab0d.js is empty:

imagen

userquin commented 10 months ago

In fact, the file is there but without extension (: is invalid in Window FS):

imagen

censujiang commented 10 months ago

This is really a wonderful thing. It should be a problem of packaging policy control.

userquin commented 10 months ago

If @dcloudio/vite-plugin-uni is relying on plugins position, it is wrong, Vite 3/4 included that change in 3.1 IIRC, check https://github.com/vitejs/vite/discussions/13175 (pwa build plugin using sequential: https://github.com/vite-pwa/vite-plugin-pwa/blob/main/src/plugins/build.ts#L36-L43)

NOTE: that shouldn't be a problem since the sw seems to be generated properly

censujiang commented 10 months ago

If @dcloudio/vite-plugin-uni is relying on plugins position, it is wrong, Vite 3/4 included that change in 3.1 IIRC, check vitejs/vite#13175 (pwa build plugin using sequential: https://github.com/vite-pwa/vite-plugin-pwa/blob/main/src/plugins/build.ts#L36-L43)

In other words, uniapp has changed the behavior of vite, but there is no good back compatibility. If this is determined, I need to feedback this problem to the project team of uniapp

censujiang commented 10 months ago

If @dcloudio/vite-plugin-uni is relying on plugins position, it is wrong, Vite 3/4 included that change in 3.1 IIRC, check vitejs/vite#13175 (pwa build plugin using sequential: https://github.com/vite-pwa/vite-plugin-pwa/blob/main/src/plugins/build.ts#L36-L43)

NOTE: that shouldn't be a problem since the sw seems to be generated properly

I just took a look at your latest modification. Is there a problem with file name generation?

userquin commented 10 months ago

On Windows fs you cannot use : in the name (iirc in any fs).

censujiang commented 10 months ago

I would like to ask a question, in manual injection mode, is it possible to implement page reloading (window.location.reload()) without importing a virtual module? The mention in the document makes me a little vague.

https://vite-pwa-org.netlify.app/guide/auto-update.html#automatic-reload

userquin commented 10 months ago

Don't remove refreshing flag, if you're testing it via Chrome Dev Tools Update on Reload button:


let refreshing;
navigator.serviceWorker.addEventListener('controllerchange',
  function() {
    if (refreshing) return;
    refreshing = true;
    window.location.reload();
  }
);