google-chrome - 在 Chrome 扩展内容脚本中使用 `chrome.devtools.panels.create()`

Question

我在内容脚本中有这个:

  chrome.devtools.panels.create('Suman Extension Page Controls',
  'icon.png',
  'devtools-panel.html',
  function (panel) {
    console.log('my devtools panel.');

  });

但是，我收到此错误:

Uncaught TypeError: Cannot read property 'panels' of undefined

我尝试将“devtools”添加到 manifest.json 文件中的权限数组，但这是不允许的。

有没有办法从内容脚本中使用 devtools API？如何在随机网页上向 DevTools 动态添加面板？

Answer 1

从内容脚本中使用它是不正确的，来自 documentation :

The chrome.devtools.* API modules are available only to the pages loaded within the DevTools window. Content scripts and other extension pages do not have these APIs

您需要创建单独的 html文件，然后将其设置为 devtools_page您的属性(property) manifest .之后，您可以在此 html 文件中加载脚本并从此处创建面板。

扩展的好例子，就是这样做 - React Dev Tools .