无法使用 Emscripten 绑定 C++ Class
Can't Bind C++ Class With Emscripten
将 emscripten 与 c++ 结合使用,尝试绑定一个简单的 class,它只有一个静态函数,仅此而已。我在官方文档和其他地方看到的示例非常简单。所以我不明白为什么这不起作用:
EMSCRIPTEN_BINDINGS(LLWI_COLLECTION){
emscripten::class_<LLWI>("LLWI")
.class_function("prepare", &LLWI::prepare)
;
}
Intellisense 给出错误:no instance of constructor "emscripten::class_::class_ [with ClassType=LLWI, BaseSpecifier= emscripten::internal::NoBaseClass]" 匹配参数列表——参数类型为:(const char [5])
这意味着这不是 class_ 的有效构造函数,但是,我经历了 bind.h,我找到了构造函数并且应该没有任何问题,它确实需要const char* 作为参数。坦率地说,我不明白这怎么行不通,我看到的每个例子都和我做过的一样。
顺便说一句,即使 intellisense 报错,emcc 编译也没有问题。但是在浏览器中我收到错误:wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type。预计 'application/wasm'.
当我尝试从控制台调用它时,Module.LLWI.prepare() 未定义。
由于您遗漏了很多信息,让我只指出我个人需要了解的内容,以便涵盖基础知识。
您如何加载 .wasm
模块?您使用的是带有 index.html 的纯 vanilla js 吗?或者使用 reactjs
或 nextjs
之类的东西来加载? Webpack 现在有用于加载 .wasm
个模块的特定选项。
你用什么flags/options编译模块?你能分享整个 CLI 命令来编译吗?
就智能感知而言,IDE 听起来像是确定的问题。我将 vscode 与 CMakeLists.txt
一起用于 emscripten
,并且我在该部分的智能感知没有任何问题。如果那是你的工具包,我正在写一篇关于如何设置它的博客。
如果您使用的是 vanilla js 并使用某种静态服务器(如 python3 -m http.server
),this 特定提交有一个工作的 2-classes-example
文件夹,对我有用。 WASM 是异步加载的,因此需要在加载后调用它。只需按照示例进行操作,它就会正常工作(祈祷)。
如果您将 webpack 与 ReactJS 之类的东西一起使用,请确保在编译时使用这些标志:
ENVIRONMENT=web
MODULARIZE=1
EXPORT_ES6=1
和可选的 DEMANGLE_SUPPORT=1
(只是因为我正在使用它并且它有效)。对于 webpack.config.js
,包括以下内容:
module.exports = {
...
experiments: {
asyncWebAssembly: true,
},
output: {
...
webassemblyModuleFilename: "static/wasm/[modulehash].wasm",
},
...
}
现在您可以导入 [module].js
,这将在您的 React 项目中加载 [module].wasm
。
如果您想使用 CMakeLists.txt
设置您的 C++ 项目,请通过 twitter 联系我,我非常乐意帮助您设置。
将 emscripten 与 c++ 结合使用,尝试绑定一个简单的 class,它只有一个静态函数,仅此而已。我在官方文档和其他地方看到的示例非常简单。所以我不明白为什么这不起作用:
EMSCRIPTEN_BINDINGS(LLWI_COLLECTION){
emscripten::class_<LLWI>("LLWI")
.class_function("prepare", &LLWI::prepare)
;
}
Intellisense 给出错误:no instance of constructor "emscripten::class_
这意味着这不是 class_ 的有效构造函数,但是,我经历了 bind.h,我找到了构造函数并且应该没有任何问题,它确实需要const char* 作为参数。坦率地说,我不明白这怎么行不通,我看到的每个例子都和我做过的一样。
顺便说一句,即使 intellisense 报错,emcc 编译也没有问题。但是在浏览器中我收到错误:wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type。预计 'application/wasm'.
当我尝试从控制台调用它时,Module.LLWI.prepare() 未定义。
由于您遗漏了很多信息,让我只指出我个人需要了解的内容,以便涵盖基础知识。
您如何加载
.wasm
模块?您使用的是带有 index.html 的纯 vanilla js 吗?或者使用reactjs
或nextjs
之类的东西来加载? Webpack 现在有用于加载.wasm
个模块的特定选项。你用什么flags/options编译模块?你能分享整个 CLI 命令来编译吗?
就智能感知而言,IDE 听起来像是确定的问题。我将 vscode 与
CMakeLists.txt
一起用于emscripten
,并且我在该部分的智能感知没有任何问题。如果那是你的工具包,我正在写一篇关于如何设置它的博客。
如果您使用的是 vanilla js 并使用某种静态服务器(如 python3 -m http.server
),this 特定提交有一个工作的 2-classes-example
文件夹,对我有用。 WASM 是异步加载的,因此需要在加载后调用它。只需按照示例进行操作,它就会正常工作(祈祷)。
如果您将 webpack 与 ReactJS 之类的东西一起使用,请确保在编译时使用这些标志:
ENVIRONMENT=web
MODULARIZE=1
EXPORT_ES6=1
和可选的 DEMANGLE_SUPPORT=1
(只是因为我正在使用它并且它有效)。对于 webpack.config.js
,包括以下内容:
module.exports = {
...
experiments: {
asyncWebAssembly: true,
},
output: {
...
webassemblyModuleFilename: "static/wasm/[modulehash].wasm",
},
...
}
现在您可以导入 [module].js
,这将在您的 React 项目中加载 [module].wasm
。
如果您想使用 CMakeLists.txt
设置您的 C++ 项目,请通过 twitter 联系我,我非常乐意帮助您设置。