I've been working on developing a Progressive Web App (PWA) that is functioning well online using the Stencil PWA template. However, I'm facing challenges in getting it to work offline.
stencil.config.ts
import { Config } from '@stencil/core';
// https://stenciljs.com/docs/config
export const config: Config = {
globalScript: 'src/global/app.ts',
globalStyle: 'src/global/app.css',
taskQueue: 'async',
outputTargets: [
{
type: 'www',
serviceWorker: {
globPatterns: [
// Prefetch all local data
'**/*.{js,css,json,html,ico,png}',
// Prefetch all the api calls
'https://www.revisedenglishversion.com/jsonrevexport.php?permission=yUp&autorun=1&what=*',
],
},
},
],
};
The project can be found here. Would appreciate any guidance on what might be incorrect with my implementation?
Update: To address the issue, I have started caching the retrieved data using @capacitor/store, eliminating the necessity to cache it within the app.