Skip to content
This repository was archived by the owner on May 3, 2022. It is now read-only.

Commit 35acd12

Browse files
Deepansharora27Nick Vidal
authored andcommitted
docs: add typescript guide
1 parent 48d3e11 commit 35acd12

File tree

2 files changed

+52
-1
lines changed

2 files changed

+52
-1
lines changed

docs/WebAssembly/TypeScript.md

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
# WebAssembly with TypeScript
2+
3+
With TypeScript, we do not have direct support for compiling it to a WebAssembly Binary and then executing it any of the Standard WASI Runtimes.
4+
5+
But TypeScript is a very near relative of JavaScript. Most of the times TypeScript code is transpiled to JavaScript code during the Development Cycle.
6+
7+
Therefore, the best approach to using TypeScript in WebAssembly is to transpile it into JavaScript and then use it.
8+
9+
## Installing the TypeScript Compiler
10+
11+
You will need to install the TypeScript compiler globally or in your workspace to transpile TypeScript Source Code to JavaScript.
12+
13+
The easiest way to install it is through npm, the Node.js Package Manager. If you have npm installed, you can install TypeScript globally on your Computer by:
14+
15+
```bash
16+
npm install -g typescript
17+
```
18+
19+
## Step 1: Create a Simple TS File
20+
21+
Open your Code Editor and then create a `index.ts` file or you can name it whatever you want.
22+
Now place the following code in the File:
23+
24+
```TypeScript
25+
function fibonacci(num: number) {
26+
var a: number = 1;
27+
var b: number = 0;
28+
var temp: number;
29+
while (num >= 0) {
30+
temp = a;
31+
a = a + b;
32+
b = temp;
33+
num--;
34+
}
35+
console.log("Fibonacci Term is:", b);
36+
}
37+
```
38+
39+
## Step 2: Transpiling it to JavaScript
40+
41+
Open your Terminal and type in this command:
42+
43+
```bash
44+
tsc index.ts
45+
```
46+
47+
Now, you will be able to see the transpiled version of your source code in JavaScript in your Directory.
48+
49+
Now, since you have your JavaScript code now with you, you can follow the instructions at [WebAssembly Guide with JavaScript](https://enarx.dev/docs/WebAssembly/JavaScript) and then you can compile your JavaScript code to WebAssembly.
50+
51+
Note that in one of the Subsections of the Guide which is `JavaScript Code Snippet`, it is mentioned to create a new file `index.js`. Now, in that file, you can copy your JavaScript code which you just transpiled right now and substitute it in place of the existing function and you will be good to go.

sidebars.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ const sidebars = {
3131
{
3232
type: 'category',
3333
label: 'WebAssembly Guide',
34-
items: ['WebAssembly/Introduction', 'WebAssembly/Rust', 'WebAssembly/C++', 'WebAssembly/C', 'WebAssembly/Golang', 'WebAssembly/AssemblyScript', 'WebAssembly/Grain', 'WebAssembly/Zig', 'WebAssembly/JavaScript'],
34+
items: ['WebAssembly/Introduction', 'WebAssembly/Rust', 'WebAssembly/C++', 'WebAssembly/C', 'WebAssembly/Golang', 'WebAssembly/AssemblyScript', 'WebAssembly/Grain', 'WebAssembly/Zig', 'WebAssembly/JavaScript', 'WebAssembly/TypeScript'],
3535
},
3636
{
3737
type: 'category',

0 commit comments

Comments
 (0)