is @vite-pwa/nuxt ssr-friendly? about docs

[userquin]

If we don't use PWA it works fine, but with PWA it goes to /

Because any server page is missing from sw precache and the sw will return the content of /, if you exclude /test from sw interception (add that route to workbox.navigateFallbackDenylist), it should work: beware, when offline browser offline page will be there when requesting /test.

For example, if you go to https://vitesse-nuxt3.netlify.app/, enter aaa in the input, click the Go button and then refresh the page once in /hi/aaa page, you can check the response in the network tab, the request being intercepted by the sw returning the / page content.

[Guito]

Also happening to me. Did you find a solution @prstwo ?

[userquin]

When using a meta framework we need to deal with server pages. We need the context where the PWA will run in the client, for example:

• do you have server pages (when using Nuxt, are you using nuxi generate or nuxi build)?
• are you generating static pages (nitro.prerender)?
• do you have protected pages (sign-in)?

A simple workaround for Nuxt will be an empty index.vue page (use it as the fallback for offline: navigateFallback: '/'), then add a simple middleware (only for client) to redirect/navigate to the home page (if you've protected pages, you can use the auth middleware redirecting to the protected home page when signed-in): check this middleware https://github.com/elk-zone/elk/blob/main/middleware/auth.ts and the index.vue page in the elk.zone repo.

Any api call and server page should be excluded from the sw interception: for server pages, you should add the required logic to avoid accessing those server pages if you're offline (you can also use a simple client middleware with offline logic redirecting to some page or just throw an error and handle it in a custom error page): check https://github.com/elk-zone/elk/blob/main/service-worker/sw.ts#L36-L50 (you can use workbox.navigateFallbackDenylist if using generateSW strategy).

[Guito]

Thanks for your response @userquin

In my case I am deploying to Vercel and I have protected pages.

I'm not totally sure if I understand the middleware part. It seems you want to always get the user to a default page, but we wanted them to enter the page they navigated to. So, for example:

User enters /test and he gets redirected to /
We want the user to enter /test and stay there

If we don't use PWA it works fine, but with PWA it goes to /

[userquin]

In previous example, the hi route excluded in Nitro prerender, and so the html page will be missing and the entry in the sw precache manifest also missing: https://github.com/antfu/vitesse-nuxt3/blob/main/nuxt.config.ts#L36-L39.

Nuxt by default will exclude any page when using build command. In the example we exclude the hi route.

[Guito]

I confirm this works. Thank you again @userquin, you are very helpful

[woldtwerk]

When I include '@vite-pwa/nuxt' in modules I get data-ssr="false".

Is this related?

[userquin]

Check vite-pwa/nuxt#74