JavaScript Library in Rust Example

A simple example demonstrating how to create a Rust library that can be used in JavaScript/TypeScript via WebAssembly (WASM), specifically designed for Deno.

Overview

This project showcases:

• Writing a Rust library with exported functions
• Compiling Rust to WebAssembly using wasm-pack
• Using the WASM module in Deno with TypeScript

Project Structure

.
├── Cargo.toml                 # Rust project configuration
├── src/
│   └── lib.rs                 # Rust source code with exported functions
├── pkg/                       # Generated WASM package (after build)
│   ├── javascript_library_in_rust_example.js
│   ├── javascript_library_in_rust_example.d.ts
│   └── javascript_library_in_rust_example_bg.wasm
└── examples/
    └── deno/
        ├── deno.json          # Deno configuration
        └── example.ts         # Deno example using the WASM library

Prerequisites

• Rust (1.56 or later)
• wasm-pack - Build tool for Rust WASM
• Deno - JavaScript/TypeScript runtime

Installation

# Install Rust (if not already installed)
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

# Install wasm-pack
cargo install wasm-pack

# Install Deno
curl -fsSL https://deno.land/x/install/install.sh | sh

Building the WASM Library

Build the Rust library to WebAssembly:

wasm-pack build --target deno

This will:

1. Compile the Rust code to WebAssembly
2. Generate JavaScript bindings
3. Generate TypeScript definitions
4. Place everything in the pkg/ directory

Available Functions

The library exports three simple functions:

• hello(): Returns a "Hello, World!" message
• greet(name: string): Returns a personalized greeting
• add(a: number, b: number): Adds two numbers together

Running the Deno Example

After building the WASM library, run the example:

cd examples/deno
deno run --allow-read example.ts

Or using the Deno task:

cd examples/deno
deno task dev

Expected Output

=== Rust WASM Library Demo in Deno ===

1. Calling hello():
   Hello, World from Rust WASM!

2. Calling greet('Deno'):
   Hello, Deno! Welcome to Rust WASM in Deno!

3. Calling add(5, 7):
   Result: 12

4. More examples:
   greet('World') = Hello, World! Welcome to Rust WASM in Deno!
   add(10, 20) = 30
   add(-5, 5) = 0

✅ All examples completed successfully!

Development

Running Tests

Test the Rust code:

cargo test

Modifying the Library

1. Edit src/lib.rs to add or modify functions
2. Rebuild with wasm-pack build --target deno
3. The changes will be available in the pkg/ directory

How It Works

1. Rust Code: Functions in src/lib.rs are marked with #[wasm_bindgen] to export them to JavaScript
2. Compilation: wasm-pack compiles Rust to WASM and generates JavaScript/TypeScript bindings
3. Import: Deno imports the generated JavaScript module which loads and interfaces with the WASM binary
4. Execution: JavaScript/TypeScript code can call the exported Rust functions naturally

TypeScript Support

The generated package includes TypeScript definitions (.d.ts files), providing full type safety and IDE autocompletion when using the library in TypeScript.

License

This is an example project for educational purposes.

Resources

• Rust and WebAssembly
• wasm-bindgen Documentation
• Deno Manual
• WebAssembly