KPC
Kevin Powell - Community•9mo ago
Kiran

How can I turn a React application into a PWA?

I am currently using a React application with Vite and I want to turn it into a PWA by implementing a customized popup for users to download the application. I have attempted a few solutions, but the service worker is not registering and I am only able to access the PWA on desktop and not mobile devices. I am using a vite-plugin-pwa and need assistance in resolving this issue. Can anyone help me sort this out?
6 Replies
Jochem
Jochem•9mo ago
you'll have to post a lot more info. code, error messages, things you've tried to fix those error messages, that kind of stuff.
Kiran
Kiran•9mo ago
Hi Jochem sorry for not giving more info I'll be sharing more info on it.
Kiran
Kiran•9mo ago
This is how i tried to build registering the service worker & before prompt in App.jsx and in vite config made the workbox cache the file

App.jsx

service-worker.js

vite.config.js

Kiran
Kiran•9mo ago
@Jochem Could you please check this and correct any errors and give the possible way to make the pwa?
Jochem
Jochem•9mo ago
Sorry, not really my expertise. Just trying to get more info for others that might have an answer
Kiran
Kiran•9mo ago
This sounds good to me. Thank you for your help!
Want results from more Discord servers?
Add your server
More Posts
FLEX WRAP IN MEDIA QUERY NOT WORKINGwhy isn't the header btn .a (github button) & toggle btn wrapping onto the next line???Need ideas for a collection of person profilesSo I'm on a cms driven site for b2b events like: https://preview.events.weka-fachmedien.de/medical-dHow to achieve this animationhttps://www.veed.io/view/a4e9b64b-1e53-4903-a087-feb493f5c6bb?panel=share I am trying to replicate tReact Problem with Tailwind?I just started using react 2 days ago. Im currently facing a problem with react to tailwind. The proHOW TO MAKE HEADER CONTENT LINE UP WITH FLEXBOX COLUMNShow do i make it so that the pic on the left and github button line up with the ending of the flex bResponsive navbar question - Kevin's videoHi all, in video below Kevin explains how to create a custom mobile menu which will open and close wNot able to do import export functions in node.js projectI'm making a memory game, I want to export a function. logic.js ```js function incrementAttempts()Getting Chart.js to work in a Vue js projectI'm trying to use Chart.js in Vue project but nothing seems to happen when I follow the documentatioBest animation Library with Vanilla JSHey guys so I'm building my site with vanilla JS and was introduced to different animation librariesIs there a way to force iOS to display a vertical scrollbar on a desired element?I've been tearing my hair out trying to figure out why my scrollbars are disappearing, and it turns