如何在Chrome扩展Service Worker中使用RxJS？导入报错求助

Chrome扩展的Service Worker环境中，全局对象并非浏览器的window，也不存在global变量。你使用的RxJS UMD包会尝试在第416行执行global.rxjs = {}，但此时global为undefined，因此抛出类型错误。

方案1：使用RxJS的ES模块版本（推荐） #

替换UMD版为ES模块版本的RxJS，直接在background.js中通过ES模块语法导入：

// background.js（需在manifest中配置为模块类型）
import * as rxjs from "./libs/rxjs.esm.js";

同时在扩展的manifest.json中，将background的service_worker配置为支持模块：

"background": {
  "service_worker": "background.js",
  "type": "module"
}

方案2：手动定义全局对象适配UMD包 #

在background.js开头添加代码，将globalThis赋值给global，让UMD包能识别全局对象：

// background.js开头
globalThis.global = globalThis;
// 之后导入UMD包
import * as rxjs from "./libs/rxjs.umd.js";

方案3：使用importScripts加载UMD包 #

Service Worker支持importScripts方法，直接加载UMD包后使用全局变量：

// background.js
importScripts("./libs/rxjs.umd.js");
// 直接使用全局的rxjs变量
const { from, map } = rxjs;

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