WebAssembly學習(五)：AssemblyScript - Hello World

一、項目創建

1.創建AssemblyScript根目錄

mkdir AssemblyScript

 2.安裝AssemblyScript開發依賴

cnpm install --save-dev AssemblyScript/assemblyscript

 3.在根目錄下創建ts文件目錄

mkdir assembly

4.在assembly目錄下創建ts配置文件tsconfig.json，內容如下

{
  "extends": "../node_modules/assemblyscript/std/assembly.json",
  "include": [
    "./**/*.ts"
  ]
}

5.在assembly目錄下創建module.ts文件，內容如下

export function add(a: i32, b: i32): i32 {
  return a + b;
}

二、編譯

1.在AssemblyScript根目錄下package.json中添加以下編譯腳本命令

"scripts": {
    "build": "npm run build:untouched && npm run build:optimized",
    "build:untouched": "asc assembly/module.ts -t module.untouched.wat -b module.untouched.wasm --validate --sourceMap --measure",
    "build:optimized": "asc assembly/module.ts -t module.optimized.wat -b module.optimized.wasm --validate --sourceMap --measure --optimize"
   }

2.運行編譯腳本，將assembly/module.ts編譯為module.untouched.wasm二進制文件

npm run build

注意：如果構建失敗，則可能需要（此時）npm install --save-dev ts-node

三、使用

1.在AssemblyScript根目錄下創建module.js文件，內容如下，用來加載並實例化.wasm模塊

const fs = require("fs");
module.exports = new WebAssembly.Instance(new WebAssembly.Module(fs.readFileSync(__dirname + "/module.optimized.wasm"), {})).exports;

2.在AssemblyScript根目錄下創建hello.js文件，內容如下，用來使用module.js導出的模塊

var myModule = require("./module.js");
console.log(myModule.add(1, 2));

3.運行結果如下

E:\Code\AssemblyScript>cmd.exe
Microsoft Windows [版本 10.0.17134.590]
(c) 2018 Microsoft Corporation。保留所有權利。

E:\Code\AssemblyScript>node hello.js
3

E:\Code\AssemblyScript>

4.最終目錄結構如下

TS為JS類型的超集，AS為TS的子集，其中一些支持的數據類型和限制還有待學習，所以最終只是實現一個簡單的加法運算。