Custom Caching Strategy with next-pwa

[1mehdifaraji]

How can I use a specific caching strategy with next pwa ?

For example I use it like this :

const withPWA = require("next-pwa");
const runtimeCaching = require("next-pwa/cache");

module.exports = withPWA({
pwa: {
dest: "public",
runtimeCaching,
disable: process.env.NODE_ENV === "development",
},
});

How can I use the network first caching strategy with next-pwa ?

[kennethstarkrl]

runtimeCaching takes an array of caching strategies objects, passed the example one from cache.js
Took me a bit to figure this out, hope it helps.

module.exports = withPWA({
    pwa:{
      dest:'public',
      runtimeCaching: [
        {
          urlPattern: /\.(?:json|xml|csv)$/i,
          handler: 'NetworkFirst',
          options: {
            cacheName: 'static-data-assets',
            expiration: {
              maxEntries: 32,
              maxAgeSeconds: 24 * 60 * 60 // 24 hours
            }
          }
        },
      ]
    },
})