将扩展迁移到 Manifest v3 时出错答案

【问题标题】：Errors when migrating extension to Manifest v3将扩展迁移到 Manifest v3 时出错
【发布时间】：2022-01-14 19:15:59
【问题描述】：

尝试将 Chrome 扩展程序从清单 v2 迁移到 v3，但遇到了一些错误。弹出脚本似乎正在运行（当我单击扩展图标时会弹出主页），但它似乎根本看不到后台脚本。

将扩展文件夹上传到浏览器时，出现以下 2 个错误：

警告：Service Worker 注册失败
未捕获的引用错误：未定义窗口

似乎第二个错误是第一个错误的原因，但我不确定它从哪里得到这个window。我删除了代码中可能引用 window 的所有内容，但我仍然收到该错误。

我可能需要更改一些 webpack 设置，但我不确定具体是什么。所以各位，如果有人遇到类似问题或只是尝试迁移扩展程序，请让我知道您是否有任何想法。

这是我的清单文件：

{
  "manifest_version": 3,
  "name": "__MSG_extName__",
  "description": "__MSG_extDescription__",
  "default_locale": "en",
  "permissions": [
    "tabs",
    "storage",
    "cookies"
  ],
  "host_permissions": [
    "<all_urls>"
  ],
  "content_security_policy": {
    "extension_pages": "script-src 'self'; object-src 'self'"
  },
  "icons": {
    "16": "icons/16.png",
    "48": "icons/48.png",
    "128": "icons/128.png"
  },
  "background": {
    "service_worker": "js/background.js"
  },
  "action": {
    "default_popup": "popup.html",
    "default_title": "__MSG_extName__"
  },
  "web_accessible_resources": [
    {
      "resources": [
        "icons/*.png",
        "fonts/*",
        "css/*"
      ],
      "matches": [
        "<all_urls>"
      ]
    }
  ]
}

我使用了 vue-web-extension 插件来创建扩展。

如果需要，我们很乐意提供任何其他详细信息。

【问题讨论】：

Service Worker 没有window，因此您需要删除所有使用它的代码，例如也许它是一个图书馆。

标签： webpack google-chrome-extension service-worker manifest migrate

【解决方案1】：

你必须将你的 background.js 文件和你的 service worker 文件放在一起，你的错误就会得到解决。将 service worker 文件和 background.js 文件放在同一个文件夹中。而且 Service Worker 没有 window，因此您需要删除所有使用它的代码。

【讨论】：