Webassembly 01 basic information

01 Basic tools

WebAssembly Text format (.wat) and WebAssembly Assembly format (.wasm) The relationship between assembly code and machine code is similar .

01.01 wabt Toolset

wabt The toolset provides .wat and .wasm A tool for converting files to each other .

wabt Toolset github Address :
https://github.com/WebAssembly/wabt/releases

win:https://github.com/WebAssembly/wabt/releases/download/1.0.29/wabt-1.0.29-windows.tar.gz
mac:https://github.com/WebAssembly/wabt/releases/download/1.0.29/wabt-1.0.29-macos.tar.gz
linux:https://github.com/WebAssembly/wabt/releases/download/1.0.29/wabt-1.0.29-ubuntu.tar.gz

The above corresponds to wabt edition , After decompressing , Add environment variables .

You can also download the complete source code , There are some in it demo.

git clone --recursive https://github.com/WebAssembly/wabt.git
cd wabt
git submodule update --init

## linux and macos
mkdir build
cd build
cmake ..
cmake --build .

## windows vs
mkdir build
cd build
cmake .. -DCMAKE_BUILD_TYPE=DEBUG -DCMAKE_INSTALL_PREFIX=..\ -G "Visual Studio 17 2022"
cmake --build . --config DEBUG --target install

01.02 emsdk

git clone https://github.com/juj/emsdk.git --depth=1
cd emsdk
git pull

#  Current stable version 
#emsdk install sdk-3.1.17-64bit
emsdk install 3.1.17
#  View version information 
emcc -v

01.03 Online verification demo

https://webassembly.github.io/wabt/demo/wat2wasm/

01.04 Official documents

wasm Syntax update faster , Try to read the grammar instructions on the official website . Really not line , Find it directly in the source code .

https://webassembly.org/getting-started/developers-guide/

hell_world.c

#include <stdio.h>
int main() {
  printf("hello, world!");
  return 0;
}

#  Default generation  a.out.js,a.out.wasm
./emcc tests/hello_world.c
node a.out.js
#  You can specify -o  Output  .html  file , Convenient test (hello.js, hello.wasm, hello.html)
./emcc tests/hello_world.c -o hello.html
#  Browser open  hello.html, In debugging state , console window , You can see the output : hello, world!