时间戳

首页 > 解决方案 > Workbox 迁移到 V5 进展不顺利

workbox - Workbox 迁移到 V5 进展不顺利

问题描述

我正在尝试迁移到 Workbox v5。旧脚本运行良好，但这只是给了我

importScripts 未定义

所以我按照迁移说明使用捆绑器 - 我正在使用汇总。

包很干净，看起来不错。

如果我运行工作箱 injectManifest test.cjs sw.js 我得到

Please pass in a valid CommonJS module that exports your configuration.

IDBObjectStore is not defined

有人知道发生了什么吗？


import {skipWaiting, clientsClaim} from 'workbox-core';
import {precacheAndRoute} from 'workbox-precaching';
import {registerRoute} from 'workbox-routing';
import {StaleWhileRevalidate, CacheFirst, NetworkFirst} from 'workbox-strategies';
import {CacheableResponsePlugin} from 'workbox-cacheable-response';
import {ExpirationPlugin} from 'workbox-expiration';


skipWaiting();
clientsClaim();

/**
 * The workboxSW.precacheAndRoute() method efficiently caches and responds to
 * requests for URLs in the manifest.
 */


precacheAndRoute(self.__WB_MANIFEST);

// Cache the Google Fonts stylesheets with a stale-while-revalidate strategy.
registerRoute(
  /^https:\/\/fonts\.googleapis\.com/,
  new StaleWhileRevalidate({
    cacheName: 'google-fonts-stylesheets',
  })
);

// Cache the underlying font files with a cache-first strategy for 1 year.
registerRoute(
  /^https:\/\/fonts\.gstatic\.com/,
  new CacheFirst({
    cacheName: 'google-fonts-webfonts',
    plugins: [
      new CacheableResponsePlugin({
        statuses: [0, 200],
      }),
      new ExpirationPlugin({
        maxAgeSeconds: 60 * 60 * 24 * 365,
        maxEntries: 31,
      }),
    ],
  })
);

registerRoute(
  '/database',
  new NetworkFirst({
    cacheName: 'static-resources',
  })
);

registerRoute(
  '/',
  new StaleWhileRevalidate({
    cacheName: 'static-resources',
  })
);

registerRoute(
  /http.*\.(?:js|css|mjs)$/,
  new CacheFirst({
    cacheName: 'libraries',
    plugins: [
      new ExpirationPlugin({
        maxAgeSeconds: 30 * 24 * 60 * 60, // 30 Days
      }),
    ],
  }),
);

registerRoute(
  /\.(?:png|gif|jpg|jpeg|svg)$/,
  new CacheFirst({
    cacheName: 'images',
    plugins: [
      new ExpirationPlugin({
        maxEntries: 60,
        maxAgeSeconds: 30 * 24 * 60 * 60, // 30 Days
      }),
    ],
  }),
);

标签： workbox

解决方案

您不能将模块导入与工作箱 cli 一起使用。Common JS不支持导入。

推荐阅读