2402d,d中开始wasm
原文
最近,由于SebastiaanKoppe在移植DRuntime以在WebAssembly(WASM)上运行方面的出色工作,现在可用完整的运行时和Phobos实现,在浏览器中运行D代码.
本指南详细介绍如何安装,并在自己的Web项目中使用D.
假设你用的是Linux系统,但类似可让它在窗口下工作.如果有足够需求,我稍后可用指定的窗口说明扩展指南.
要求
Git
Clang
D编译器(LDC/DMD/GDC)
CMake 3.8+
Ninja
GNU make
Python
Phobos的std.net.curl的libcurl(如,最近Ubuntu上的libcurl4)
zlib-dev(如,Ubuntu上的zlib1g-dev)
LLVM开发6.0+
Binaryen
在Ubuntu18.04或20.04上,可用以下命令安装这些版本(可能适合其他基于Debian的发布版;未测试):
sudo apt install git make clang++ ldc cmake ninja-build zlib1g-dev libcurl4 llvm-dev libclang-common-6.0-dev binaryen
此外,此时,创建个新目录来容纳与WASM上的D设置相关的所有内容:
mkdir wasm-dlang && cd wasm-dlang
安装WASI-Libc
如果选择做一个,请确保在wasm-dlang目录中.
克隆仓库及其子模块
git clone --recurse-submodules https://github.com/WebAssembly/wasi-libc
构建sysroot
cd wasi-libc
make WASM_CC=`which clang` WASM_AR=`which llvm-ar` WASM_NM=`which llvm-nm`
安装LDC
构建ldc
返回wasm-dlang
cd ..
克隆仓库及其子模块
git clone https://github.com/skoppe/ldc.git
cd ldc
git checkout wasm
git submodule update --init
cd ..
创建构建目录及构建脚本
mkdir build-ldc && cd build-ldc
cmake -G Ninja ../ldc \
-DCMAKE_BUILD_TYPE=Release \
-DCMAKE_INSTALL_PREFIX=$PWD/../install-ldc
(如果你要为LDC打补丁,你可能需要把"Release"更改为"RelWithDebInfo")
构建LDC
ninja -j4
这需要几分钟时间并使用大量RAM.
会有大量的警告;你可忽略它们.
如果有很多可用RAM和多核CPU,可把-j4更改为-j8甚更高,来更多并行执行工作.
构建DRuntime
返回wasm-dlang.
cd ..
创建构建目录和构建脚本.
mkdir build-druntime && cd build-druntime
echo -e '#!/bin/sh'"\n\nrm -rf $PWD/out\nCC=clang $PWD/../build-ldc/bin/ldc-build-runtime --ninja --buildDir='$PWD/out' --dFlags='-mtriple=wasm32-unknown-unknown-wasm;
-fvisibility=hidden' --targetSystem='WebAssembly' --ldcSrcDir='$PWD/../ldc' --cFlags='-target wasm32-unknown-unknown-wasi --sysroot=$PWD/..
/wasi-libc/sysroot'\nchown -R $USER:`id -gn` $PWD/out" > build
chmod +x build
运行生成脚本
sudo ./build
在Web上运行它
现在安装了个可编译D为WASM的LDC版本.但是,需要一个WASI实现,才能使用生成代码.
为了在Web上运行D,可用我编写的名为d-wasm-glue的库,它实现了一个WASI接口,及一些胶水代码,以便更方便地使用D中的JS对象,及一个围绕LDC的包装器来传递构建WASM期望的所有命令行选项.
它生成的wasm-ldc包装器,其命令行选项与LDC语法完全相同.
返回wasm-dlang
cd ..
编译胶水代码.
git clone https://github.com/brianush1/d-wasm-glue
cd d-wasm-glue
rdmd wasm-ldc.d --build-wasm-compiler --add-to-path
// you may choose to remove the '--add-to-path' if you do not want it automatically added to your $PATH in ~/.profile
例:
//example.d
import std.stdio;
import glue;
void main() {
writeln("Hello, from D!"); //打开`JS`控制台,看到此消息
js.document.body.innerHTML = "Hello, everyone!";
}
example.html:
<body>
<script src="glue.min.js">script>
<script>
runFile("example.wasm");
script>
body>
构建命令:
wasm-ldc example.d
注意
确实需要通过本地Web服务器运行它;因为CORS,不能直接按文件加载example.html到浏览器中.