webpack MV3 webworker 目标使用

Question

我正在尝试将旧的 Chrome MV2 项目转换为 MV3。构建系统使用 webpack。我从文档中了解到，我应该将目标设置为“webworker”来为 MV3 构建 Service Worker 来替换我的 MV2 背景页面。

我的 webpack.config.js 文件中包含以下代码：

module.exports = {
  ...
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        loader: 'esbuild-loader',
        options: {
          loader: 'ts',
          target: 'webworker'
        }
      },
    ],
  },

当我使用此配置时，仅将之前的“es2015”更改为“webworker”，构建失败 出现以下错误：

  Error: Invalid target: "webworker" (valid: esN, chromeN, edgeN, firefoxN, iosN, nodeN, safariN)

文档提示可能涉及 WebpackOptionsApply 插件，但我使用该插件时出现故障。我尝试过为该插件设置参数，但没有发现任何有效的方法。

  plugins: [
    new WebpackOptionsApply(),

我能找到的关于使用 webpack 进行 MV3 服务工作者的文档似乎并不多，而且我也不是 typescript 或 webpack 专家。从 typescript 或 webpack 迁移对我们来说不是一个可行的选择。如果我恢复使用“es2015”作为目标，我会从一些（未识别的）包含的库中提取“窗口”引用，我需要在 MV3 中消除这些引用。我希望使用“webworker”来识别并消除哪个库。