使用JavaScript ES6模塊導入現有庫

Question

如何使用JavaScript的ES6模塊加載和運行現有的庫？

例如，假設我需要加載現有的polyfill：

import {poly} from "thirdParty/poly"; 

如何在不更改源的情況下運行導入的poly腳本並將其屬性加載到當前命名空間？

以下是兩個實際問題，以幫助澄清我正在嘗試解決的問題：

1. 我有一個名為rafPolyfill.js的腳本，它是window.requestAnimationFrame的rafPolyfill.js 。 我需要將它導入全局范圍並在加載后立即運行它。 使用<script>標記很容易做到這一點：

它運行並將自身加載到全局范圍。 如何使用ES6模塊完成這項工作？

2. 我有另一個名為Font.js腳本，它是字體的預加載器。 它讓你創建這樣的新字體對象：

   var font = new Font（）;

我使用Font.js加載腳本標記，如下所示：

<script src="Font.js"><script>

如果不訪問，更改或理解此腳本的源代碼，如何使用ES6模塊以與<script>標記相同的方式加載和使用它？ 我只需要這些腳本在加載時運行並自行處理。

可能的解決方案可能是使用模塊Loader API：

http://wiki.ecmascript.org/doku.php?id=harmony:module_loaders

這個文檔描述了System加載器的全局綁定 ，但是我恐怕沒有詞匯來完全理解它試圖解釋的內容。 任何有關解碼此文檔的幫助將不勝感激！

Answer 1

這個答案是：“不，基於ES6規范，不可能像使用腳本標記一樣加載和運行全局腳本。”

但有一個解決方案：SystemJS

https://github.com/systemjs/systemjs

它是ES6模塊，AMD模塊和全局腳本（使用<script>標簽加載的任何內容）的通用模塊加載器

Answer 2

這個或類似的東西對你有用嗎？

var stuffFromPoly = import "thirdParty/poly"

然后，您將調用存儲在stuffFromPoly中的對象的方法。

如果不是這樣，你可以稍微擴展一下你的問題嗎，我正在試着猜測你的意思，我可能會有點偏僻。

快速記錄''你的更新'：

您是否反對使用https://www.npmjs.org/package/es6-module-loader ？ 或者這不能解決問題嗎？

從自述文件：

新的ES6模塊規范使用導入和導出語法在JavaScript中定義模塊系統。 對於動態加載模塊，規范中還包含動態模塊加載器工廠（新的加載器）。

單獨的瀏覽器規范定義了瀏覽器的動態ES6模塊加載器加載器，window.System，以及使用模塊的標記。

此polyfill實現Loader和Module全局變量，完全按照2013-12-02 ES6模塊規范草案和系統瀏覽器加載器中的指定，完全按照示例實現中的建議。