如何使用 JavaScript 的 ES6 模块加载和运行现有库?
例如,假设我需要加载一个现有的 polyfill:
import {poly} from "thirdParty/poly";
如何运行导入的 poly
脚本并将其属性加载到当前命名空间而不更改源?
这里有两个实际问题可以帮助阐明我要解决的问题:
我有一个名为
rafPolyfill.js
的脚本这是 window.requestAnimationFrame 的 polyfill。我需要将它导入全局范围并在加载后立即运行它。使用<script>
很容易做到这一点标签:
它运行并将自身加载到全局范围内。如何使用 ES6 模块完成此操作?
我有另一个名为
Font.js
的脚本这是字体的预加载器。它让您像这样创建新的字体对象:var font = new Font();
我通过使用脚本标签加载它来使用 Font.js,如下所示:
<script src="Font.js"><script>
在不访问、更改或理解此脚本的源代码的情况下,如何使用 ES6 模块以与 <script>
相同的方式加载和使用标签?我只需要这些脚本在加载时运行并自行处理。
一个可能的解决方案可能是使用模块加载器 API:
http://wiki.ecmascript.org/doku.php?id=harmony:module_loaders
本文档描述了 System
的全局绑定(bind) loader,但恐怕我没有足够的词汇来完全理解它试图解释的内容。非常感谢任何帮助解码此文档的人!
最佳答案
这个答案是:“不,根据 ES6 规范,不可能像使用脚本标签那样加载和运行全局脚本。”
但是有一个解决方案:SystemJS
https://github.com/systemjs/systemjs
它是一个通用的模块加载器,适用于 ES6 模块、AMD 模块和全局脚本(任何你用 <script>
标签加载的东西)
关于javascript - 使用 JavaScript ES6 模块导入现有库,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22277917/