带有模块加载程序的Emscripten
Emscripten with module loaders
我正试图使用Emscripten将C库变成一个可移植的JavaScript模块,它将由AMD(如Require.JS)加载,并提供对其功能和内容的访问:
require("vendor/mylib.js", function(mylib) {
mylib.function1();
});
然而,我看到Emscripten用大量变量污染了全局命名空间,这违背了模块应该独立且不与其他加载的模块冲突的前提。
所以问题是:将Emscrpiten与AMD一起使用的最佳方法是什么
有没有办法告诉Emscripten不要向global
泄露任何信息?
emcc文档中有两个命令行选项可以提供帮助,即--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 ...});
});
下面是一个更完整的示例,在模块定义对象中设置画布元素。我还包括了domReady插件,以便能够在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支持的画布元素。
上面的HTML页面可以在http://plnkr.co/edit/8jE3uLwrlszQuHbixU68?p=preview。它加载一个C++程序:
#include <iostream>
using std::cerr;
int main() {
cerr << "In C++ main function";
}
如果你加载Plunker,那么你应该看到"在C++主函数中"两次,每个加载的模块一次。
如果您需要访问由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);
});
- 如何使用url加载程序在webpack中导入多个图像
- keyup事件处理程序更改焦点不适用于快速键入
- 用程序搜索JQuery数据表中的文本
- Javascript:selenium Web驱动程序isDisplayed()不工作
- Canvas Html5绘图应用程序,移动画布会导致重大问题
- Emberjs应用程序加载在除Index之外的所有路由上
- ExtJS 5用程序点击actioncolumn gridview
- 使用电话间隙在Android应用程序中显示SQL Lite的数据
- 如何从Java/scala调用js美化程序
- 在AngularJS应用程序中使用封装指令和路由的推荐方式是什么
- Windows8应用程序(html&Javascript):从图片库(除了文件选择器)显示图像的另一种方式
- angular 1.5应用程序中的导航栏
- YUI3 IO实用程序是否可以根据给定的内容类型标头值自动序列化数据
- 如何创建带有插槽的vue js组件预加载程序
- 带有模块加载程序的Emscripten
- 我可以使用emscripten在i386模式下编译应用程序吗
- 在 Emscripten'd C++ 程序中处理数据后,如何修复尝试从 Web worker 发回数据时的“内存不足”错
- 如何在不复制canvas imageData的情况下将其传递给emscripten c++程序
- 在mac上使用cython和emscripten编译琐碎的python程序到javascript
- 将命令行参数传递给emscripten生成的应用程序