Bulk Add All (*.js) or (*.css) files to service worker cache on install

Question

If I have a service worker registered with the doc root ( / ) as its scope, And my Document Layout is like so:

• Doc-Root
  • Includes
    • JS
      • PHP/JS /HTML Files
    • CSS
      • PHP/CSS Files
    • Typography

How Do I Add All JS Only/CSS Only files to the service worker cache On Install and exclude other extensions Under each Directory?

Answer 1

I recommend using a utility like sw-precache that will take care of generating the service-worker.js file.

Here's an example from one of my projects. You can change the glob pattern to fit your needs.

const swPrecache = require('sw-precache')
swPrecache.write('./public/service-worker.js', {
    root: './public/',
    staticFileGlobs: ['./public/**/*'],
    stripPrefix: './public/'
})