如何成功地將 ES6 模組匯入到我的 Chrome 擴充功能的內容腳本中？

在 Chrome 擴充內容腳本中匯入 ES6 模組

問題： 在 Chrome 63 中，使用內容中的匯入/匯出語法匯入 ES6模組腳本結果語法

解決方案：

Chrome 擴充透過非同步動態 import() 函數支援 ES6模組：

(async () => {
  const src = chrome.runtime.getURL("your/content_main.js");
  const contentMain = await import(src);
  contentMain.main();
})();

但是，此方法有限制：

• 可能被網站服務封鎖
• 需要在清單的Web 可存取資源中聲明導入的腳本。

對於非模組腳本，請考慮：

• 使用普通的非-module script。
• 將其名稱新增至「content_scripts」中主要內容之前的「js」中腳本。
• 直接使用全域變數/函數。

附加資訊：

• [如何使用ES6 “import” ”與Chrome擴充](https://stackoverflow.com/a/ 50132415)
• [Chrome 中ES6導入的工作範例擴充](https://github.com/browsers-toolbox/es-import-in-extension)
• [chrome.runtime.getURL](https://developer.chrome.com /extensions/runtime #method-getURL)

以上是如何成功地將 ES6 模組匯入到我的 Chrome 擴充功能的內容腳本中？的詳細內容。更多資訊請關注PHP中文網其他相關文章！