编译 C/C++ 为 WebAssembly

Emscripten 环境安装

所需条件
你需要将下列工具安装在你的电脑上，首先让我们确认下都有哪些。
Git — Linux 和 macOS 的机器一般已经预装了，在 Windows 下你可以从这里下载 Git for Windows installer。
CMake — 在 Linux 或者 macOS 上，使用类似 apt-get 或 brew 这样的包管理器来安装它，请确保依赖以及路径是否正确。在 Windows 上，使用 CMake installer。
主系统编译器 — 在 Linux 下，安装 GCC。在 macOS 下，安装 Xcode。在 Windows 下，安装 Visual Studio Community 2015 with Update 3 or newer。
Python 2.7.x — On Linux and macOS, this is most likely provided out of the box. 从 初学者指南 获取帮助。在 Windows 上，从 Python 主页获取安装包。

备注：在 Windows 下你可能需要 pywin32，为了降低安装 pywin32 可能遇到的错误，请使用管理员权限在 cmd 内运行安装程序。

git clone https://github.com/juj/emsdk.git
cd emsdk

# 在 Linux 或者 Mac macOS 上
./emsdk install --build=Release sdk-incoming-64bit binaryen-master-64bit
./emsdk activate --global --build=Release sdk-incoming-64bit binaryen-master-64bit
# 如果在你的 macos 上获得以下错误
Error: No tool or SDK found by name 'sdk-incoming-64bit'
# 请执行
./emsdk install latest
# 按照提示配置环境变量即可
./emsdk activate latest

# 在 Windows 上
emsdk install --build=Release sdk-incoming-64bit binaryen-master-64bit
emsdk activate --global --build=Release sdk-incoming-64bit binaryen-master-64bit

# 注意：Windows 版本的 Visual Studio 2017 已经被支持，但需要在 emsdk install 需要追加 --vs2017 参数。
# 如果在你的 Windows 上获得以下错误
Error: No tool or SDK found by name 'sdk-incoming-64bit'
# 请执行
emsdk install --build=Release sdk-releases-upstream-c2369dc425725fff86ba90a9007a4603ddf7941b-64bit  binaryen-main-64bit 

现在让我们进入 emsdk 文件夹，输入以下命令来让你进入接下来的流程，编译一个样例 C 程序到 asm.js 或者 wasm。

# on Linux or Mac macOS
source ./emsdk_env.sh

# on Windows
emsdk_env.bat

编译样例代码
现在环境配置完毕，让我们看看如何使用它把 C 代码编译到 Emscripten。当使用 Emscripten 来编译的时候有很多种不同的选择，我们介绍其中主要的 2 种：

编译到 wasm 并且生成一个用来运行我们代码的 HTML，将所有 wasm 在 web 环境下运行所需要的“胶水”JavaScript 代码都添加进去。
编译到 wasm 然后仅仅生成 JavaScript。
让我们一个一个看看。

生成 HTML 和 JavaScript
我们先来看一个最简单的例子，通过这个，你可以使用 Emscripten 来将任何代码生成到 WebAssembly，然后在浏览器上运行。
首先我们需要编译一段样例代码。将下方的 C 代码复制一份然后命名为 hello.c 保存在一个新的文件夹内。

#include <stdio.h>

int main(int argc, char ** argv) {
  printf("Hello World\n");
}

现在，转到一个已经配置过 Emscripten 编译环境的终端窗口中，进入刚刚保存 hello.c 文件的文件夹中，然后运行下列命令：

emcc hello.c -s WASM=1 -o hello.html

下面列出了我们命令中选项的细节：

-s WASM=1 — 指定我们想要的 wasm 输出形式。如果我们不指定这个选项，Emscripten 默认将只会生成 asm.js。
-o hello.html — 指定这个选项将会生成 HTML 页面来运行我们的代码，并且会生成 wasm 模块，以及编译和实例化 wasm 模块所需要的“胶水”js 代码，这样我们就可以直接在 web 环境中使用了。
这个时候在你的源码文件夹应该有下列文件：

hello.wasm 二进制的 wasm 模块代码
hello.js 一个包含了用来在原生 C 函数和 JavaScript/wasm 之间转换的胶水代码的 JavaScript 文件
hello.html 一个用来加载，编译，实例化你的 wasm 代码并且将它输出在浏览器显示上的一个 HTML 文件