标签: emscripten

我决定使用 emscripten 移植一些使用 zlib 的程序。配置失败，因为它抱怨我的系统上没有 zlib。

但：

>ls ~/.emscripten_ports/
freetype      libpng      sdl2        sdl2-image.zip  sdl2-ttf.zip  zlib
freetype.zip  libpng.zip  sdl2-image  sdl2-ttf        sdl2.zip      zlib.zip

和：

> ls ~/.emscripten_cache/asmjs/
dlmalloc.bc  libc.bc       libcxx_noexcept.a  sdl2.bc            sdl2-ttf.bc
freetype.bc  libcxx.a      libpng.bc          sdl2-image.bc      wasm-libc.bc
gl.bc        libcxxabi.bc  ports-builds       sdl2-image-png.bc  zlib.bc

和：

> ls ~/.emscripten_cache/asmjs/ports-builds/
freetype  include  libpng  sdl2  sdl2-image  sdl2-ttf  zlib

我可以使用 --with-libzlib=dir 指定 zlib 的路径

如何配置这个项目？如果这些信息有帮助，我会编译 lincity。

我自己编译了 zlib，使用 emscripten。

emconfigure ./cofigure --prefix=$PATH_TO_SYSTEM_DIR_IN_EMSCRIPTEN
emmake make
emmake make install

我不知道它有效，但是 lincity 的配置并没有抱怨缺少 zlib。它抱怨缺少 libxml-2 并且 libxml-2 需要 python2，所以我放弃了。把这个放在答案中？

有没有办法从 EMSCRIPTEN C++ 应用程序访问 DOM？

例如，我想读取/设置 html textarea 的值并接收 html 按钮 onclick 事件。

有人可以提供 C++ 片段吗？

谢谢。

我已经在纯 Javascript 和 C 中实现了一个非常简单的快速排序，后者被导出为 WebAssembly 模块。

我正在对[0;1000] 范围内的 2 个相同的 10 ^{6 个}整数数组进行排序。纯 javascript 实现平均需要 780 毫秒，而基于 WebAssembly 的实现需要 935 毫秒（未设置优化标志时为 1020 毫秒）。

为什么纯 javascript 实现最快？

在有问题的 2 个实现下面：

JS：

function swap(array, swapy1, swapy2) {
  let tmp = array[swapy1];
  array[swapy1] = array[swapy2];
  array[swapy2] = tmp;
}


function partition(array, lo, hi) {
  const pivot = array[hi];
  let i = lo - 1;
  for (let j = lo; j < hi; j++) {
    if (array[j] < pivot) {
      if (i …

所以我试图将 emscripten 移植到 WebAssembly (wasm) 一个程序，该程序在开头包含以下内容：

#include <Eigen/Geometry>
#include <boost/filesystem.hpp>
#include <dvo/core/intrinsic_matrix.h>
#include <dvo/core/surface_pyramid.h>
#include <dvo/dense_tracking.h>
#include <fstream>
#include <iostream>
#include <opencv2/opencv.hpp>

为了轻松开始，我尝试编译一个最小的 hello world OpenCV 程序：

#include <opencv2/opencv.hpp>
#include <stdio.h>
using namespace cv;
int main(int argc, char **argv) {
  Mat M(2, 2, CV_8UC3, Scalar(0, 0, 255));
  std::cout << "M = " << std::endl << " " << M << std::endl;
  return 0;
}

我有以下几点CMakeLists.txt：

cmake_minimum_required(VERSION 2.8)
project( DisplayImage )
find_package( OpenCV REQUIRED PATHS third-party/opencv-4.1.0/build_wasm NO_DEFAULT_PATH)
include_directories( ${OpenCV_INCLUDE_DIRS} …

我正在尝试emcc使用 gradle编译项目，但到目前为止未能找到任何有关如何完成的体面示例（或自行学习）。

到目前为止，我尝试做的是以这种方式设置叮当声的路径：

model {
    toolChains {
        clang(Clang) {
            path "<path-to-emcc>"
        }
    }
    ...
}

我收到一条“找不到 C 编译器‘clang’。” 信息。我尝试的下一件事是创建一个指向 emcc 的 clang 符号链接，但是，再次失败了。

我有一个简单的 c 函数。

void fill(float *a, float *b)
{
  a[0] = 1;
  b[0] = 2;
}

int main()
{
    float a[1];
    float b[1];

    fill(a, b);

    printf("%f\n", a[0]);
    printf("%f\n", b[0]);

    return 0;
}

这给了我

1.000000
2.000000

现在我正在尝试通过 WebAssembly 从 JavaScript 做同样的事情。

var wasmModule = new WebAssembly.Module(wasmCode);
var wasmInstance = new WebAssembly.Instance(wasmModule, wasmImports);

const a = new Float32Array(wasmInstance.exports.memory.buffer, 0, 1)
const b = new Float32Array(wasmInstance.exports.memory.buffer, 4, 1)

wasmInstance.exports.fill(a, b)

log(a)
log(b)

这是 wasm 小提琴https://wasdk.github.io/WasmFiddle/?19x523

这次a是[2]，b 是[0] …

我想为我的科学程序测试 QT WebAssembly。因此，我安装了 emscripten。

$em++ --version

返回

emcc (Emscripten gcc/clang-like replacement) 1.38.30 (commit a5082b232617c762cb65832429f896c838df2483)...

然后我使用 Qt WebInstaller 安装了 Qt。在我的安装目录中，我有一个wasm_32文件夹，其中包含bin和qmake：

$ ~/Qt_web/5.13.2/wasm_32/bin/qmake --version 

返回

QMake version 3.1
Using Qt version 5.13.2 in /home/myName/Qt_web/5.13.2/wasm_32/lib

但是，当我启动 Qt creator 时，单击ProjectsI see a Kit called: Qt 5.13.2 WebAssemblybut I can't select it（它是灰色的）。当我单击管理套件时，我看到没有为 Qt 5.13.2.WebAssembly 选择 C ​​和 C++ 编译器。

当我更改为Qt Versions. 警告说：

ABI detection failed: Make sure to use a matching compiler when building. …

我正在尝试将一个 JavaScript 文件导入到使用 Emscripten 从 C 代码编译的 React 中。这类似于这里的这个问题，但答案似乎不起作用。目标是能够在 JS 文件中导入函数并像调用命名函数一样调用它。我编译JS文件与MODULARIZE=1和WASM=0使用下面的命令：

emcc ../../helloWorld/ping.c -o ../../helloWorld/ping.js -s WASM=0 -s ENVIRONMENT=web -s EXTRA_EXPORTED_RUNTIME_METHODS="['cwrap']" -s MODULARIZE=1

ping.c

#include <stdio.h>
#include <emscripten.h>

EMSCRIPTEN_KEEPALIVE
int pingIt() {
  return 1;
}

导入PingIt.js

let Module = require('./ping.js'); // Your Emscripten JS output file
let pingIt = Module().cwrap('pingIt'); // Call Module as a function

Module.exports = pingIt;

应用程序.js

import React from 'react';
import './App.css';
import pingIt from './importPingIt.js';

export default …

我有一个用 cmake 构建的 c++ 项目。它编译和链接很好。目标是使用 Emscripten 从中生成将在浏览器中运行的代码。

从上Emscripten网站上的文档在这里可以发现：

运行前两个命令（emconfigure 和 emmake）后，看似成功，我在任何地方都没有任何 .bc 文件，尽管它实际上确实生成了 .js 和 .wasm 文件。文档暗示 .js 文件只会由执行第三个命令 ./emcc 产生。

在您找到的同一文档页面上再往下一点：

Make 生成链接的 LLVM 位码。它不会在链接期间自动生成 JavaScript，因为所有文件都必须使用相同的优化和编译器选项进行编译——在从 bitcode 到 JavaScript 的最终转换中这样做是有意义的。

所以它似乎应该产生一些位码。这该怎么做？

（我确实按照那些文档的建议使用了 VERBOSE 命令，虽然我没有看到使用 emcc 而不是本机编译器，但正在使用 em++，这似乎与 emcc 大致相同。）

我正在尝试使用 CMake 将 C++ 项目编译为 webassembly。我正在使用 emscripten，我想使用 SDL2 和 Freetype 的 emscripten 端口。通常，当使用 emcc 进行编译时，您将使用以下标志：-USE_SDL=2 和 -USE_FREETYPE=1，以便包含这些端口。但是我不知道如何使用 CMake 实现这一点。

这是我的 CMakeList 文件：

cmake_minimum_required(VERSION 3.15)
project(project)

set(CMAKE_CXX_STANDARD 20)
set(CMAKE_CXX_FLAGS "${CMAKE_CXX_FLAGS} -Wall -Wextra")

find_package(SDL2 REQUIRED)
find_package(Freetype REQUIRED)
include_directories(${CMAKE_SOURCE_DIR}/include ${SDL2_INCLUDE_DIRS} ${FREETYPE_INCLUDE_DIRS})

add_executable(project src/main.cpp src/glad.c src/Game.cpp src/Block.cpp include/jumpyblock/Block.h)
target_link_libraries(project ${SDL2_LIBRARIES} ${FREETYPE_LIBRARIES})

它使用常规 cmake 编译并成功运行。

到目前为止，我已经尝试使用 编译emcmake cmake . && make，这给了我一个错误，说它找不到 SDL2 的包配置文件。

我已经尝试修改 CMakeList 文件以使用端口的 emcc 标志：

cmake_minimum_required(VERSION 3.15)
project(project)

set(CMAKE_CXX_STANDARD 20)
set(CMAKE_CXX_FLAGS "${CMAKE_CXX_FLAGS} -Wall -Wextra -USE_SDL=2 -USE_FREETYPE=1")

include_directories(${CMAKE_SOURCE_DIR}/include ${SDL2_INCLUDE_DIRS} ${FREETYPE_INCLUDE_DIRS})

add_executable(project …