Importing non-browser JS

View full source code or view the compiled example online

The #[wasm_bindgen] attribute can be used on extern "C" { .. } blocks to import functionality from JS. This is how the js-sys and the web-sys crates are built, but you can also use it in your own crate!

For example if you're working with this JS file:

// defined-in-js.js
export function name() {
    return 'Rust';

export class MyClass {
    constructor() {
        this._number = 42;

    get number() {
        return this._number;

    set number(n) {
        return this._number = n;

    render() {
        return `My number is: ${this.number}`;

you can use it in Rust with:

fn main() {
use wasm_bindgen::prelude::*;

#[wasm_bindgen(module = "/defined-in-js.js")]
extern "C" {
    fn name() -> String;

    type MyClass;

    fn new() -> MyClass;

    #[wasm_bindgen(method, getter)]
    fn number(this: &MyClass) -> u32;
    #[wasm_bindgen(method, setter)]
    fn set_number(this: &MyClass, number: u32) -> MyClass;
    fn render(this: &MyClass) -> String;

// lifted from the `console_log` example
extern "C" {
    #[wasm_bindgen(js_namespace = console)]
    fn log(s: &str);

fn run() {
    log(&format!("Hello from {}!", name())); // should output "Hello from Rust!"

    let x = MyClass::new();
    assert_eq!(x.number(), 42);

You can also explore the full list of ways to configure imports