Difference between revisions of "WebAssembly/Compiler"

From Lazarus wiki
Jump to navigationJump to search
Line 35: Line 35:
 
[https://github.com/WebAssembly/wabt/releases wasm tools]
 
[https://github.com/WebAssembly/wabt/releases wasm tools]
  
Extract the binaries and put them somewhere in your path.
+
Extract the binaries and put them somewhere in your PATH.
  
 
And you'll need some more wasm tools:
 
And you'll need some more wasm tools:
Line 41: Line 41:
 
[https://github.com/skalogryz/wasmbin]
 
[https://github.com/skalogryz/wasmbin]
  
Compile wasmtool.lpi.
+
* Compile wasmtool.lpi
At the time of writing (26th Nov 2019) ppwasm does not search wasmtool in PATH, so you have to copy it to each project folder.
+
* Compile wasmld.lpi and rename wasmld to wasm-ld
 +
 
 +
Put wasmtool and wasm-ld somewhere in your PATH
  
 
==wasm-demo==
 
==wasm-demo==

Revision as of 12:17, 26 November 2019

Instructions

Compiling the compiler

Get the sources:

git clone https://github.com/skalogryz/freepascal fpc-wasm

switch to correct branch:

cd fpc-wasm
git checkout webasm

compile:

cd compiler
 

Using Lazarus

 open ppcwasm.lpi

hit the "compile" button.

Using command-line
fpc -dnoopt -dwasm -Fiwasm -Fuwasm -Fusystems -S2 pp.pas 

the compiler can be renamed

mv pp ppwasm

or, on windows:

mv pp.exe ppwasm.exe

Using the compiler

You need a system.pas unit. It can be found here:

wasm-demo

You'll also need the wasm tools:

wasm tools

Extract the binaries and put them somewhere in your PATH.

And you'll need some more wasm tools:

[1]

  • Compile wasmtool.lpi
  • Compile wasmld.lpi and rename wasmld to wasm-ld

Put wasmtool and wasm-ld somewhere in your PATH

wasm-demo

Wasm-demo is a Pascal WebAssembly demo project, ported Google's C WebAssembly example (https://codelabs.developers.google.com/codelabs/web-assembly-intro)

You follow these steps in order to get the demo project working:

1. Get the project sources: https://github.com/skalogryz/wasm-demo

Using in webassembly.studio

2. Run the wasm compiler against lyff.pas, but request the assembler file to be kept

 pp -a lyff.pas

Webassembly.studio accepts the assembler file and would compile it on the server side.

3. open up https://webassembly.studio and select "Create empty Wat Project". The project will consist of:

main.html
main.js
main.wat

All files of the project can be edited through the web interface.

4. Copy and paste the contents of the following files:

(compiled) lyff.wat to main.wat.
wasm-demo\webassembly.studio\main.html to main.html
wasm-demo\webassembly.studio\main.js to main.js

Note: every time you copy and paste, don't forget to press "SAVE" button (on the right side of the web interface)

5. once all files are update, hit "Build and Run"

See Also