如何理解Workbox报错Config must be set before accessing workbox.* modules

错误原因 #

你对源码的判断存在偏差，this.Ct 并非永远为true：

• Ct 初始值为false，只有当loadModule()方法被触发时才会被置为true
• 触发loadModule的核心逻辑是Workbox实例挂载的Proxy拦截器：只要你访问workbox对象下除原生方法外的任意子模块属性（比如workbox.routing、workbox.precaching等），就会自动触发对应子模块加载，同时将Ct设为true，此时再调用setConfig就会抛出你遇到的错误。

常见报错诱因 #

• 代码顺序错误：setConfig没有放在所有workbox子模块调用的最前面
• 隐式访问：在setConfig调用前，有其他代码（比如前置引入的其他脚本、测试用的console打印等）访问了workbox的子模块属性

修复方案 #

严格保证setConfig是你调用workbox的第一个方法，正确的代码顺序如下：

// 1. 引入workbox核心脚本
importScripts('/local_path/workbox-sw.js');

// 2. 第一时间调用setConfig，中间不要插入任何workbox相关操作
workbox.setConfig({
  debug: false,
  modulePathPrefix: '/local_path/workbox/3.3.0/'
});

// 3. 再编写其他workbox业务逻辑
workbox.routing.registerRoute(
  // 你的路由配置逻辑
)

如果调整顺序后仍然报错，可以在setConfig调用前加断点排查，确认是否有其他脚本在不知情的情况下访问了workbox的子模块属性。

内容的提问来源于stack exchange，提问作者chrisbo