跨瀏覽器擴充功能開發
跨瀏覽器擴充功能開發指的是寫一個擴充功能，能同時上架到 Chrome、Edge 與 Firefox，而不需要分叉程式碼。Extension.js 會把單一專案編譯成各瀏覽器專屬的產物（dist/chrome、dist/edge、dist/firefox），並依當前目標過濾 manifest。重新載入流程、執行階段 API 與打包行為都會對應你正在除錯的瀏覽器。
只使用一份 manifest.json，就能鎖定特定瀏覽器或自訂瀏覽器二進位檔。若你需要在 Chromium 家族目標中使用 browser.* API 相容性，可以啟用 polyfill。
Chrome 與 Firefox 擴充功能相容性
Chrome 與 Firefox 擴充功能共用大部分 WebExtensions 表面，但每天都會碰到三個關鍵差異：- 背景腳本： Chrome（Manifest V3）需要
background.service_worker。Firefox 則使用background.scripts搭配非持久的 event page。Extension.js 會在這兩種形態之間做雙向轉換，因此同一份 manifest 中兩種寫法都可行。 - 執行階段 API 命名空間： Firefox 原生支援
browser.*，Chromium 使用chrome.*。在 Chromium 目標可以加上--polyfill來彌平差異。 - 權限與內容安全政策（CSP）： 不同瀏覽器對某些
permissions與host_permissions條目的判斷不同。將瀏覽器專屬的值放在帶前綴的 manifest 鍵內，而不是在執行階段做功能偵測。
瀏覽器專屬的 manifest 欄位
Extension.js 透過帶前綴的 manifest 欄位，讓單一份manifest.json 在各瀏覽器上都能運作。在編譯時，Extension.js 會把帶前綴的鍵（chromium:、chrome:、edge:、firefox:、gecko:）過濾到當前目標，未加前綴的鍵則套用到所有目標。完整前綴清單請見 瀏覽器專屬的 manifest 欄位。
範本範例
action
運作方式
1) 選擇瀏覽器目標
選擇你要執行擴充功能的瀏覽器。 常見目標使用--browser，或傳入自訂的瀏覽器二進位檔。
- macOS：
/Applications/Brave Browser.app/Contents/MacOS/Brave Browser - Linux：
/usr/bin/brave-browser（或其他 Chromium 系瀏覽器的二進位檔） - Windows：
"C:\\Program Files\\BraveSoftware\\Brave-Browser\\Application\\brave.exe"
--chromium-binary對應chromium-based--gecko-binary對應gecko-based
2) 以瀏覽器專屬的 manifest 過濾進行編譯
在編譯時，Extension.js 只會包含你選定瀏覽器所需的 manifest 欄位。 例如：chromium:、chrome: 與 edge: 等前綴。對 Firefox 家族目標，Extension.js 會使用
firefox: 與 gecko:。
完整的帶前綴 manifest 欄位細節，請參閱 瀏覽器專屬的 manifest
欄位。
background 的轉換是雙向的
常見情況下你不需要為 background 加前綴。Extension.js 會雙向轉換一般的 MV3background：
- Gecko 建置若找到
background.service_worker而沒有background.scripts，會透過scripts把 background 重新指向產出的 bundle，並移除 Firefox 會拒絕的service_worker與type。 - Chromium MV3 建置若找到
background.scripts且尚未設定 worker，會用第一個 script 來填入service_worker。
scripts 一律會從輸出中移除。只要出現 background.scripts，即使旁邊有合法的 service_worker，Chromium MV3 也會拒絕整個擴充功能，因此這個鍵永遠不能出現在 Chromium 建置中。
3) 為每個瀏覽器目標輸出
Extension.js 會把各目標寫入各自的建置資料夾：dist/chromedist/edgedist/firefoxdist/chromium（預設目標）dist/chromium-based（自訂 Chromium 引擎）dist/gecko-based（自訂 Gecko 引擎）
4) Chromium 目標可選的 browser.* polyfill
如果你的程式碼使用 browser.*，可為 Chromium 家族目標啟用 --polyfill：
webextension-polyfill（Mozilla 的 browser.* 相容性函式庫）。Firefox 本身已原生支援
browser.*，Extension.js 會略過這一步。
polyfill 模組會先從你的專案解析，接著才是 Extension.js 內建的相依套件。套件管理器可能會把 webextension-polyfill 提升到你的專案根目錄，而你自己安裝的那份會優先於內建的那份。若完全解析不到任何一份，建置會印出警告並在沒有 polyfill 的情況下繼續，而不是直接失敗。
最佳實務
- 保持單一程式碼庫：可能的話，把瀏覽器差異放在帶前綴的 manifest 欄位裡。
- 一次只建一個目標：在持續整合（CI）中為每個瀏覽器產出獨立的產物（
dist/<browser>）。 - 必要時才使用
--polyfill：build預設關閉，需要你明確傳入--polyfill；dev與start則預設開啟。若你的程式碼不依賴browser.*，在這兩個指令傳入--no-polyfill將其關閉。 - 及早確認 API 支援：在依賴特定瀏覽器 API 前，先查閱 MDN WebExtensions 文件。
下一步
- 進一步了解 可用的瀏覽器。
- 進一步了解 瀏覽器專屬的 manifest 欄位。