While most SPA frameworks have their own PWA plugins, the Vite development tool also has one. What I like about it is that you have the same plugin whether you're using Vue, React, SvelteKit, or Pure JavaScript. Since it's at the Vite level, it is easier to manage. Let's take a look:
00:00 - Introduction
00:54 - The Project
02:51 - Installing the Plugin
04:05 - The PWA Files
05:12 - Customizing the Manifest
07:27 - Testing Offline
09:00 - Adding a Runtime Cache in the workbox
12:39 - Wrapping Up
Source code: https://github.com/shawnwildermuth/codingshorts/tree/main/vite-pwa
If you like this video, you might like other videos in my Instructional Videos:
- https://www.youtube.com/playlist?list=PLtOvnDRdH12e3vOq4zvpI2cKsancIwMcP
You can hire me too! You can reach me at my new website:
- https://shawn.wildermuth.com