@@ -53,7 +53,31 @@ uint32_t exports_docs_adder_add_add(uint32_t x, uint32_t y)
5353}
5454```
5555
56- ## 4. Compile a WebAssembly module (P1) with `clang`
56+ ## 4. Compile a WebAssembly P2 component with `wasi-sdk`'s `wasm32-wasip2-clang`
57+
58+ Given that `wasi-sdk` has ben installed, we can build a Preview 2 component quickly by using the provided `wasm32-wasip2-clang` binary:
59+
60+ ```console
61+ /opt/wasi-sdk/bin/wasm32-wasip2-clang \
62+ -o adder.wasm \
63+ -mexec-model=reactor \
64+ component.c \
65+ adder.c \
66+ adder_component_type.o
67+ ```
68+
69+ After this command completes, you will have a new file named ` adder.wasm ` available in the source folder.
70+
71+ For details on a more manual approach , see the following instructions:
72+
73+ <details >
74+ <summary >Manual P1 & P2 build using `wasi-sdk`'s `clang` and `wasm-tools`</summary >
75+
76+ ## Build a WebAssembly module (P1) with ` clang `
77+
78+ > [ !WARNING]
79+ > These instructions are no longer necessary given that ` wasi-sdk ` 's ` wasm32-wasip2-clang ` can be used directly.
80+ > The instructions below are left mostly as a reference for those who want to take an alternative route.
5781
5882Now, you can compile the function into a Wasm module via clang:
5983
@@ -77,7 +101,7 @@ clang component.c adder.c adder_component_type.o -o adder.wasm -mexec-model=reac
77101[wasi-sdk-images]: https://github.com/WebAssembly/wasi-sdk/pkgs/container/wasi-sdk
78102[wasi-sdk-dockerfile]: https://github.com/WebAssembly/wasi-sdk/blob/main/docker/Dockerfile
79103
80- ## 5. Convert the P1 component to a P2 component with `wasm-tools`
104+ ### Convert the P1 component to a P2 component with `wasm-tools`
81105
82106Next, we need to transform the P1 component to a P2 component. To do this, we can use `wasm-tools component new`:
83107
@@ -88,7 +112,7 @@ wasm-tools component new ./adder.wasm -o adder.component.wasm
88112> [ !NOTE]
89113> The ` .component. ` extension has no special meaning -- ` .wasm ` files can be either modules or components.
90114
91- ## 6. (optional) Build a WASI-enabled WebAssembly (P2) component with ` wasm-tools `
115+ ### (optional) Build a WASI-enabled WebAssembly (P2) component with ` wasm-tools `
92116
93117Do note ` wasm-tools component new ` may fail if your code references any [ WASI] [ wasi ] APIs that must be imported, for
94118example via standard library imports like ` stdio.h ` .
@@ -135,7 +159,9 @@ wasm-tools component new adder.wasm --adapt wasi_snapshot_preview1.wasm -o adder
135159
136160[ wasmtime-releases ] : https://github.com/bytecodealliance/wasmtime/releases
137161
138- ## 7. Inspect the built component
162+ </details >
163+
164+ ## 5. Inspect the built component
139165
140166Finally, you can inspect the embedded wit to see your component (including any WASI imports if necessary):
141167
0 commit comments