30 秒執行任何 GitHub 上的擴充功能
下面的章節涵蓋兩條路徑。你會了解 Extension.js 把什麼視為專案根目錄，以及它如何解析像「光是輸入範例名稱」這類有歧義的輸入。dev 如何解析專案
extension dev 可接受一個可選的第一個參數。解析方式如下：
- 沒有參數： 將目前的工作資料夾視為擴充功能專案。
- 本地路徑： Extension.js 把它當成相對於目前工作資料夾的路徑（例如，你 clone 了某個儲存庫後，使用
./my-extension或../samples/page-redder）。 https://github.com/...URL： Extension.js 會把儲存庫（或 tree 路徑）抓取到你的工作資料夾，然後從解壓後的資料夾建置。詳情請參考 Project detection and inputs。- 其他
http(s)URL： Extension.js 會把 URL 當成 ZIP 壓縮檔，下載並在本地解壓。
sample.page-redder 這種光是名稱的字串不會觸發遠端下載；它只是你目前資料夾下的子資料夾名稱。請使用完整的 GitHub URL，或先 clone 後讓 dev 指向該路徑。
快速執行 Chrome 擴充功能範例
使用 Chrome Extension Samples 儲存庫裡的範例，快速驗證你的設定並熟悉工作流程。選項 A：完整的 GitHub tree URL（建議）
- 開啟終端機。
cd到 clone 或解壓專案應放置的資料夾（通常是一個空資料夾）。- 執行：
--browser=firefox 或 --browser=edge。
dev 如何解析專案
extension dev 可接受一個可選的第一個參數。解析方式如下：
- 沒有參數： 將目前的工作資料夾視為擴充功能專案。
- 本地路徑： Extension.js 把它當成相對於目前工作資料夾的路徑（例如，你 clone 了某個儲存庫後，使用
./my-extension或../samples/page-redder）。 https://github.com/...URL： Extension.js 會把儲存庫（或 tree 路徑）抓取到你的工作資料夾，然後從解壓後的資料夾建置。詳情請參考 Project detection and inputs。- 其他
http(s)URL： Extension.js 會把 URL 當成 ZIP 壓縮檔，下載並在本地解壓。
sample.page-redder 這種光是名稱的字串不會觸發遠端下載。它只是你目前資料夾下的子資料夾名稱。請使用完整的 GitHub URL，或先 clone 後讓 dev 指向該路徑。
先 clone，再用 dev 指向本地路徑
當你想要穩定的資料夾結構（而不是一次性試用）時，請 clone 儲存庫並讓 dev 指向本地路徑：
在 Microsoft Edge 中執行範例
Extension.js 直接支援 Microsoft Edge，不需額外設定。用完整 URL 搭配 Edge
先 clone，再使用 Edge
透過 polyfill 在 Edge 中執行 Mozilla 擴充功能
你可以在 Edge 中執行 MDN WebExtensions 範例。傳入 GitHub 的 tree URL 並啟用 polyfill（相容性層）。polyfill 會把 Firefox 風格的browser.* 呼叫對應到 Chrome 風格的 chrome.* 呼叫，讓你針對 Firefox 撰寫的擴充功能也能在 Chromium 系瀏覽器中運作。
先 clone，再使用 polyfill + Edge
從零開始建立極簡擴充功能
使用extension create 搭配 init 範本，作為最輕量的起點：只有 manifest 和圖示，沒有任何框架或 UI。
init
小提示
- 使用 TypeScript： 在專案根目錄加入
tsconfig.json檔案。 - 使用 React： 在
package.json中加入react與react-dom。 - 為 React 設定的
tsconfig.json可開啟 TypeScript + React 開發。 - 若你需要處理 manifest 中未宣告的資產，可進一步瞭解 Special folders。
最佳實務
- 使用
extension套件，以單一工具鏈建置、執行與打包你的擴充功能。 - 使用
--browser在開發時鎖定特定瀏覽器。 - 使用
--polyfill把以 Mozilla 為主的範例改寫成可在 Chromium 系瀏覽器中運作的版本。 - 一次性試用優先用完整 GitHub URL；想要穩定資料夾結構時，clone + 本地路徑。
後續步驟
- 繼續閱讀建立你的第一個擴充功能。
- 為你偏好的技術棧瀏覽起始範本。
- 透過 dev 指令選項鎖定特定瀏覽器與執行檔。