如何創建可以從彈出窗口打開新選項卡的 ReactJS chrome 擴展？

Question

我正在使用 ReactJS 創建一個 chrome 擴展。 我基本上想要有兩個頁面 - 一個用於彈出窗口，第二個頁面通過單擊彈出窗口上的按鈕在新選項卡中打開。

Answer 1

首先，我建議按照本教程了解基礎知識。

https://medium.com/@gilfink/building-a-chrome-extension-using-react-c5bfe45aaf36

這將有助於大量的基礎知識。 概括地說，您希望將public 文件夾中的 manifest.json 更改為 chrome 擴展 manifest.json 的樣子。 在 manifest.json 中，您希望添加 index.html（也在公共文件夾中），以便在您希望真正調用它的任何地方調用它。

下面的例子：

{
     "manifest_version": 2,
     "short_name": "XXX",
     "name": "XXX",
     "version": "1.0.2",

     "browser_action": {
         "default_popup": "index.html", //popup page occurs when you click on the favicon
         "default_title": "Open the popup"
     },

     "chrome_url_overrides": {
         "newtab": "index.html" //registers an override page (index.html) to the newtab page.
     }
}

覆蓋其他頁面： https : //developer.chrome.com/extensions/override

注意：確保在使用 npm run build 構建后，並在“加載未打包”中選擇 chrome 擴展時，您選擇的是構建文件夾而不是公共文件夾。