我正在尝试将我的 chrome 纯 JS 扩展迁移到 vuejs 版本。 我所有的纯 JS 版本都可以正常工作。

但是使用 vuejs 时，我在加载扩展时遇到了一个难以理解的错误。

这是我的 manifest.json 和我的 vue.config.js : Manifest :

{
  "manifest_version": 2,
  "name": "__MSG_appName__",
  "version": "2.1.0",
  "homepage_url": "https://*****.*********/",
  "description": "****** Vuejs",
  "default_locale": "fr",
  "permissions": [
    "activeTab",
    "<all_urls>",
    "*://*/*",
    "storage"
  ],
  "icons": {
    "48": "icons/icon-48.png",
    "64": "icons/icon-64.png",
    "128": "icons/icon-128.png"
  },
  "background": {
    "scripts": [
      "js/background.js"
    ],
    "persistent": true
  },
  "browser_action": {
    "default_popup": "popup.html",
    "default_title": "__MSG_appName__",
    "default_icon": {
      "48": "icons/icon-48.png",
      "64": "icons/icon-64.png"
    }
  }
}

vue.config.js :

module.exports = {
  pages: {
    popup: {
      template: "public/browser-extension.html",
      entry: "./src/popup/main.js",
      title: "Popup",
    },
  },
  pluginOptions: {
    browserExtension: {
      componentOptions: {
        background: {
          entry: "src/background.js",
        },
        contentScripts: {
          entries: {
            "content-script": [
              "src/content_scripts/contentScript.js",
              "src/content_scripts/config.js",
              "src/content_scripts/capture.js",
            ],
          },
        },
        permissions: [
          "<all_urls>",
          "activeTab",
          "contextMenus",
          "notifications",
          "storage",
          "identity",
        ],
        browser_action: {},
      },
    },
  },
};

项目正在编译，没有任何问题。 然后我通过指向 /dist 文件夹在浏览器中加载我的扩展。 然后我遇到了错误 Uncaught TypeError: Cannot read properties of undefined (reading 'onClicked') 并且我的扩展显示空白弹出窗口。 以下是导致错误的部分代码：

browser.contextMenus.onClicked.addListener(async (info, tab) => {

当然，我尝试使用“chrome”而不是“browser”，但没有成功……

如能得到任何帮助，我们将不胜感激。 提前谢谢您。