请确保您的 Service Worker 文件包含以下内容：/(const precacheManifest =)\[\](;)/

我对 React Workbox 还很陌生。我试图让我的 Electron React 应用程序能够缓存所有图像和数据，以便在离线时可用。 这正是我在 YouTube 视频中想要实现的目标。 14:00 到 21:00 分钟：使用 React 和 Workbox 构建 PWA，/watch?v=Ok2r1M1jM_M

但是这个命令给出了

"start-sw":"workbox injectManifest workbox-config.js && workbox copylibraries build/ && http-server build/ -c 0"

这个错误：

C:\Users\rajesh.ram\Desktop\Day\K\demok\client>npm run start-sw

> [email protected] /cdn-cgi/l/email-protection start-sw C:\Users\rajesh.ram\Desktop\Day\K\demok\client
> workbox injectManifest workbox-config.js && workbox copylibraries build/ && http-server build/ -c 0

Using configuration from C:\Users\rajesh.ram\Desktop\Day\K\demok\client\workbox-config.js.
Service worker generation failed:

Unable to find a place to inject the manifest. Please ensure that your service worker file contains the followin

g:/(const precacheManifest =)\[\](;)/

请帮助我解决这个问题或建议替代包/存储库/视频以使其成为可能。

在较新的工作箱版本（包括本文发布时的 5.1.3）中，指定 precacheManifest 的注入点的参数已从正则表达式更改为字符串。参数的名称也发生了变化，据我所知，这不向后兼容......这意味着它不再使用正则表达式。

module.exports = {
  "globDirectory": "build/",
  "globPatterns": [
    "**/*.{json,ico,html,png,js,txt,css,svg}"
  ],
  "swDest": "build/sw.js",
  "swSrc": "src/sw.js",
  "injectionPoint": "injectionPoint"
}

在视频的其余部分之后，按照上面的方式更改该参数对我有用。

然后其他几个更新也影响了 sw.js 的编写方式......

importScripts("workbox-v5.1.3/workbox-sw.js");

workbox.setConfig({ modulePathPrefix: "workbox-v5.1.3/" });

const precacheManifest = [injectionPoint];

workbox.precaching.precacheAndRoute(precacheManifest);

您必须删除 .suppressWarnings() 命令。它已被删除。一个好的视频......需要一些更新。

链接到演示文稿 github，需要更新，所以......https://github.com/mikegeyser/building-pwas-with-react https://github.com/mikegeyser/building-pwas-with-react

手册链接：https://developers.google.com/web/tools/workbox/reference-docs/latest/module-workbox-build https://developers.google.com/web/tools/workbox/reference-docs/latest/module-workbox-build

@梅格菲利普斯91