search

nuxt-ui-pro / dashboard

A dashboard template made with Vue and Nuxt UI Pro.
https://dashboard-template.nuxt.dev
378 stars 81 forks source link

Can't get PWA to work with UI Pro #56

Closed mkelk closed 6 days ago

mkelk commented 1 week ago

Do you have any working example of using UI Pro with PWA? I seem to be struggling endlessly with confusion between the root dir (used in regulser Nuxt) and the app dir used by UI Pro. Or maybe some pointers to how to structure the interplay of nuxt.config.js and package.json and (if using Netlify) netlify.toml.

It is quite critical for my business case and I would hate to abandon UI Pro.

Help would very much appreciated!!

Morten

benjamincanac commented 1 week ago

Would you mind sharing a reproduction of what's not working? This is too vague to help you.

mkelk commented 1 week ago

Thanks for a quick response!

Certainly, I'll collect some material tomorrow.

Roughly, it seems that vite-pwa/nuxt when building collects info in two different dirs; one for the stuff in /app and another for the PWA generated things (like the manifest). And it seems that it does not register the manifest in index.html. So like UI Pro and the PWA plugin can't really agree on where the app really is and get it collected. I have adjusted many times in nuxt.config.js without making it match up. I can make a PWA using the same methods in regular Nuxt, that is why I'm suspecting the /app aspect to be the confusing factor.

As I said, I'll collect some more specific details.

In the meantime - do you know of a single example of UI Pro and PWA working? A working example would do wonders for my debugging of what's wrong.

I'll be back with more info.

Morten

mkelk commented 1 week ago

Maybe I'll make a small demo in github to show the problem. That would probably be the most concrete way to illustrate it!

mkelk commented 6 days ago

Hi Benjamin,

Here is more detail.

Take a look at https://github.com/mkelk/tst-ui-pro-pwa, the main branch It is a fresh install of UI Pro Dashboard.

I have followed the guidelines for installing PWA. It partially works with a service-worker running, but the manifest is not registered and so the browser does not recognize the app as a PWA.

You can follow each installation step as individual commits.

I have documented both installation and problem at the top of the README: https://github.com/mkelk/tst-ui-pro-pwa

I hope you can make sense of it.

Regards, Morten

mkelk commented 6 days ago

Got it working (latest commit in https://github.com/mkelk/tst-ui-pro-pwa). I was missing <VitePwaManifest /> in the actual pages.