How to use the workbox-strategies/CacheFirst.mjs.CacheFirst function in workbox-strategies

/* global __PRECACHE_MANIFEST__ */

import {PrecacheController} from 'workbox-precaching/PrecacheController.mjs';
import {Route} from 'workbox-routing/Route.mjs';
import {CacheFirst} from 'workbox-strategies/CacheFirst.mjs';
import {cacheNames} from './caches.js';


const pc = new PrecacheController(cacheNames.SHELL);

const precacheMatcher = ({url}) => {
  return Boolean(pc.getCacheKeyForURL(url.href));
};

const cacheFirst = new CacheFirst({cacheName: cacheNames.SHELL});

export const precacheHandler = ({request, event}) => {
  const cacheKey = pc.getCacheKeyForURL(request.url);

  return cacheFirst.handle({
    request: new Request(cacheKey),
    event,
  });
};

export const createPrecacheRoute = () => {
  return new Route(precacheMatcher, precacheHandler);
};

export const install = (opts) => pc.install(opts);
export const activate = (opts) => pc.activate(opts);

* Given an asset URL that we already know to be in `/static/`, return true
 * if this assets is part of the application shell.
 * @param {string} pathname
 * @return {boolean}
 */
export const isShellAsset = (pathname) => {
  return /(html|css|mjs)$/.test(pathname);
};

const shellMatcher = ({url}) => {
  return url.hostname === location.hostname &&
      url.pathname.startsWith('/static/') &&
      isShellAsset(url.pathname);
};

export const shellStrategy = new CacheFirst({
  cacheName: cacheNames.SHELL,
});

export const createShellRoute = () => {
  return new Route(shellMatcher, shellStrategy);
};

import {ExpirationPlugin} from 'workbox-expiration/ExpirationPlugin.mjs';
import {Route} from 'workbox-routing/Route.mjs';
import {CacheFirst} from 'workbox-strategies/CacheFirst.mjs';
import {cacheNames} from '../caches.js';

const staticAssetsMatcher = ({url}) => {
  return url.hostname === location.hostname &&
      url.pathname.startsWith('/static/');
};

const staticAssetsStrategy = new CacheFirst({
  cacheName: cacheNames.STATIC_ASSETS,
  plugins: [
    new ExpirationPlugin({
      maxEntries: 100,
    }),
  ],
});

export const createStaticAssetsRoute = () => {
  return new Route(staticAssetsMatcher, staticAssetsStrategy);
};