带有模块加载器的 Emscripten

Question

我正在尝试使用 Emscripten 将 C 库转换为可移植的 JavaScript 模块，它将由 AMD（例如 Require.JS）加载并提供对其功能的访问和事情：

require("vendor/mylib.js", function(mylib) {
    mylib.function1();
});

但是，我看到Emscripten用很多变量污染了全局命名空间，这违背了模块应该独立并且不与其他加载模块冲突的前提。

所以问题是：将 Emscrpiten 与 AMD 一起使用的最佳方法是什么？

有什么方法可以告诉 Emscripten 不要泄露任何东西给 global？

Answer 1

emcc docs 中有 2 个命令行选项可以提供帮助，--pre-js <file> 和 --post-js <file>。它们允许您包装生成的代码，因此允许您与 AMD 集成。

例如，您的前缀文件可以是

// prefix.js
define(function() {
  return function(Module) {

和

的后缀文件

// postfix.js
  };
});

你可以使用

之类的东西编译输出到myModule.js

emcc --pre-js prefix.js --post-js postfix.js -o myModule.js myModule.cpp

然后是 require 模块，使用 RequireJS 语法：

require(['myModule'], function(myModule) {
  myModule({... Module definition object ...});
});

一个更完整的例子，在模块定义对象中设置一个 canvas 元素如下。我还包括 domReady plugin 以便能够在 DOM 准备就绪时抓取元素。

<!DOCTYPE html>
<html>
  <head>
    <script src="require.js"></script>
    <script>
      require(['domReady', 'myModule'], function(domReady, myModule) {
        domReady(function() {
          myModule({
            canvas: document.getElementById('canvas_1')
          });
          myModule({
            canvas: document.getElementById('canvas_2')
          });
        });
      });
    </script>
  </head>
  <body>
    <canvas id="canvas_1"></canvas>
    <canvas id="canvas_2"></canvas>
  </body>
</html>

这不仅会按照您的要求保留全局命名空间，而且如果需要，还允许您在页面中同时拥有多个 Emscripten 支持的 canvas 元素。

上面的 HTML 页面可以在 http://plnkr.co/edit/8jE3uLwrlszQuHbixU68?p=preview 上看到。它加载一个 C++ 程序：

#include <iostream>
using std::cerr;

int main() {
  cerr << "In C++ main function";
}

如果您加载 Plunker，那么您应该看到 "In C++ main function" 两次，每个加载的模块一次。

如果您需要访问由 Emscripten 修改的 Module 对象，比如调用公开的库函数，您可以执行以下操作，等待 Emscripten 本身使用 monitorRunDependencies 选项加载的所有依赖项：

require(['myModule'], function(myModule) {
  var moduleDef = {
    monitorRunDependencies: function(numberOfDependenciesRemaining) {
      if (numberOfDependenciesRemaining) return;
      // At this point we can call functions added to moduleDef
      // such as cwrap or ccall
    }
  }
  myModule(moduleDef);
});

带有模块加载器的 Emscripten

Emscripten with module loaders

javascript

module

emscripten