vue-vben-admin
vue-vben-admin copied to clipboard
Bring back the PWA
Subject of feature
PWA feature
Problem
In version 2.0.0-rc.6 (2020-10-28), The PWA is supported but then current version does not . What's the reason for removing the PWA(vite plugin). Thanks
Expected behaviour
Support PWA for better UX
@doraemonxxx
For example, use workbox v7 for offline cache only
Then you can load app offline when https
# install cli tool
npm i workbox-cli -g
# create offline libs,like "./public/workbox-v7.0.0"
workbox copyLibraries ./public
add sw.js to ./public
importScripts('./workbox-v7.0.0/workbox-sw.js');
const { registerRoute } = workbox.routing;
const { CacheFirst, StaleWhileRevalidate, NetworkFirst } = workbox.strategies;
// CacheFirst(filename with uniquely hash suffix)
registerRoute(
({ url }) =>
/\/[^\/]+-[a-zA-Z0-9\-_]{8}\.[a-z]+$/.test(url.pathname) || // build files
new CacheFirst(),
);
// StaleWhileRevalidate
registerRoute(
({ url }) =>
/^\/(index\.html)?$/.test(url.pathname) || // app entry
/^\/_app.config\.js/.test(url.pathname) || // app config
/\.ico$/.test(url.pathname) || // ico
/^\/(logo\.png)$/.test(url.pathname), // logo
new StaleWhileRevalidate(),
);
// NetworkFirst
registerRoute(
({ url, request }) => request.method === 'GET' && /^\/(basic-api)\//.test(url.pathname), // get request
new NetworkFirst(),
);
add script to ./index.html
<script type="module">
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker
.register('./sw.js')
.then((registration) => {
console.log('Service Worker registered:', registration);
})
.catch((registrationError) => {
console.log('Service Worker registration failed:', registrationError);
});
});
}
</script>
care to share why use the workbox instead of vite-plugin-pwa? thanks
This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days
Closing this issue as it has become stale and there is no opportunity for further discussion. Thank you.