workbox

问题 I have a Vue CLI 3 based app which I would like to function as a PWA. I need it to work in history mode, because the hash intervenes in redirects that I'm doing as part of an OAuth based authentication process. When the routing is in hash mode, the manages to load fine as PWA. Once I change the mode to 'history', the PWA I installed won't load anymore - I'm getting a white screen instead. I checked the browser version and it still works fine (I configured the fallback in my NGINX server to

问题 I have a Vue CLI 3 based app which I would like to function as a PWA. I need it to work in history mode, because the hash intervenes in redirects that I'm doing as part of an OAuth based authentication process. When the routing is in hash mode, the manages to load fine as PWA. Once I change the mode to 'history', the PWA I installed won't load anymore - I'm getting a white screen instead. I checked the browser version and it still works fine (I configured the fallback in my NGINX server to

问题 I wish to make sure to clear all local cache when a new service-worker is loaded by the client. In my app the cache will often hold the old assets in cache even if the service-woker is updated. This causes a lot of unwanted behaviours. I am using webpack v4.41 and workbox v6 to create my service-worker.js . I have read the documentation for workbox-expiration, but still do not understand how to clear the cache manually (the "Advanced Usage" section). app.js const wb = new Workbox('/service

问题 I use Vuejs and I use workbox-webpack-plugin in order to make my site offline, I want to cache a folder which contains all my files (3 files) like picture below, but when I build my project(using Laravel-mix ). The main.js (which contains everything of Vue) cannot be cached in service-woker.js . I tried some ways to fix that but those didn't work. Does anybody face this issue, do you have any solution, many thanks! ->> 回答1: Why are you dealing it manually? Even though you can cache all static

问题 Workbox is not working on Chrome, but it works everywhere else, which is ironic since I believe this is a Google library, the error that shows is : Uncaught (in promise) DOMException : sw.js line 1 Chrome: Opera Firefox I'm using the workbox-webpack-plugin webpack.config.js const workbox = require('workbox-webpack-plugin'); module.exports = { plugins: [ new workbox.GenerateSW({ swDest: './service-worker.js', skipWaiting: true, clientsClaim: true }) ] } index.ts (entry) if ('serviceWorker' in

问题 Workbox is not working on Chrome, but it works everywhere else, which is ironic since I believe this is a Google library, the error that shows is : Uncaught (in promise) DOMException : sw.js line 1 Chrome: Opera Firefox I'm using the workbox-webpack-plugin webpack.config.js const workbox = require('workbox-webpack-plugin'); module.exports = { plugins: [ new workbox.GenerateSW({ swDest: './service-worker.js', skipWaiting: true, clientsClaim: true }) ] } index.ts (entry) if ('serviceWorker' in

问题 I'm playing around with workbox but I am getting the following error: Skipping file 'app.js' due to size. [Max size supported is 2097152, this file is 4760833] I understand why it would do this in production, and this isn't a problem in production as my app.js file is minified and is well under that limit. But how can I generate a service worker I can use in development including these larger files? 回答1: The maximumFileSizeToCacheInBytes configuration parameter, described in more detail in

问题 I'm playing around with workbox but I am getting the following error: Skipping file 'app.js' due to size. [Max size supported is 2097152, this file is 4760833] I understand why it would do this in production, and this isn't a problem in production as my app.js file is minified and is well under that limit. But how can I generate a service worker I can use in development including these larger files? 回答1: The maximumFileSizeToCacheInBytes configuration parameter, described in more detail in

问题 I have been following a lot of tutorials of how to install workbox-webpack-plugin but I haven't succesfully managed to install it correctly. The service worker appears to be installing but its installing in the dist folder of my app (This is my webpacks output path). I think there's nothing wrong with this but when I run my app, there are no errors but the service worker is not functioning and I notice that it is being installed at localhost:8080/dist (The output path) and even if I try to

问题 Imagine we have N assets that need to be pre-cached with a service-worker once user navigated to the web site. We have appropriate precache-manifest.js with listed N-files and we are using workbox.precaching.precacheAndRoute([...]) to configure needed behavior (default CRA setup) Is there a way to keep track of precaching progress when using workbox.precaching.precacheAndRoute or workbox.precaching.precache? I imagine it could be something like passing a parameter-callback function to the