# Importing ruffle-js

**URL:** <https://talk.observablehq.com/t/importing-ruffle-js/6089>\
**Category:** Help\
**Created:** [January 16, 2022, 4:25pm UTC](https://talk.observablehq.com/t/importing-ruffle-js/6089 "2022-01-16T16:25:59Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![richard\_observing](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/richard_observing/32/6022_2.png) [@richard\_observing](https://talk.observablehq.com/u/richard_observing)\
**Post date:** [January 16, 2022, 4:25pm UTC](https://talk.observablehq.com/t/importing-ruffle-js/6089/1 "2022-01-16T16:25:59Z")

</div>

Trying to load a npm module (Ruffle - [Using Ruffle · ruffle-rs/ruffle Wiki · GitHub](https://github.com/ruffle-rs/ruffle/wiki/Using-Ruffle#javascript-api)) throws an error:

```auto
 ChunkLoadError: Loading chunk 966 failed.
(error: https://observablehq.com/@atiro/core.ruffle.14afbe2b2ea587f28d56.js)

```

I think I’m pushing things probably trying to load this emulator within a notebook, but any obvious fixes ?

> **[Leonardo Canal Challenge](https://observablehq.com/@atiro/leonardo-canal-challenge)**

Thanks

---

<div class="post-metadata">

**Author:** ![Fil](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/fil/32/207_2.png) [@Fil](https://talk.observablehq.com/u/Fil)\
**Post date:** [January 16, 2022, 5:25pm UTC](https://talk.observablehq.com/t/importing-ruffle-js/6089/2 "2022-01-16T17:25:42Z")

</div>

I’ve sent you a suggestion to load the wasm file. It seems to be working but I can’t confirm while the swf file is missing.

---

<div class="post-metadata">

**Author:** ![mootari](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mootari/32/581_2.png) [@mootari](https://talk.observablehq.com/u/mootari)\
**Post date:** [January 16, 2022, 5:27pm UTC](https://talk.observablehq.com/t/importing-ruffle-js/6089/3 "2022-01-16T17:27:46Z")

</div>

I’ve created an example here:

> **[Hello, Ruffle!](https://observablehq.com/@mootari/ruffle-js)**
>
> Ruffle is an Adobe Flash Player emulator written in the Rust programming language. Ruffle targets both the desktop and the web using WebAssembly. https://github.com/ruffle-rs/ruffle

---

<div class="post-metadata">

**Author:** ![Fil](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/fil/32/207_2.png) [@Fil](https://talk.observablehq.com/u/Fil)\
**Post date:** [January 16, 2022, 5:32pm UTC](https://talk.observablehq.com/t/importing-ruffle-js/6089/4 "2022-01-16T17:32:37Z")

</div>

for comparison, my suggestion is here [Leonardo Canal Challenge / Fil / Observable](https://observablehq.com/@fil/leonardo-canal-challenge-suggestion) ; I didn’t know of ruffle-mirror, which seems to be better than my fiddling with the config.

---

<div class="post-metadata">

**Author:** ![richard\_observing](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/richard_observing/32/6022_2.png) [@richard\_observing](https://talk.observablehq.com/u/richard_observing)\
**Post date:** [January 17, 2022, 10:53am UTC](https://talk.observablehq.com/t/importing-ruffle-js/6089/5 "2022-01-17T10:53:56Z")

</div>

Many thanks to you both. Now working - [Leonardo Canal Challenge / Richard / Observable](https://observablehq.com/@atiro/leonardo-canal-challenge).

---

<div class="post-metadata">

**Author:** ![mootari](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mootari/32/581_2.png) [@mootari](https://talk.observablehq.com/u/mootari)\
**Post date:** [March 27, 2022, 11:56am UTC](https://talk.observablehq.com/t/importing-ruffle-js/6089/6 "2022-03-27T11:56:55Z")

</div>

I’ve updated [my notebook](https://observablehq.com/@mootari/ruffle-js) to include a splash screen and download progress, implemented via `XMLHttpRequest`.
