ffmpeg/WASM

[PaulieScanlon]

Reproduction

Reproduction repo: remix-ffmpeg-wasm

1. Run the app, hit the "load" button.
2. You'll see the following error in the terminal.

Not sure if this is a Remix thing, or an ffmpeg/wasm thing so apologies in advance if i'm barking up the wrong tree.

System Info

System:
    OS: macOS 13.5
    CPU: (8) arm64 Apple M1
    Memory: 78.77 MB / 8.00 GB
    Shell: 3.2.57 - /bin/sh
  Binaries:
    Node: 21.1.0 - /opt/homebrew/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.2.0 - /opt/homebrew/bin/npm
  Browsers:
    Chrome: 119.0.6045.199
    Safari: 16.6
  npmPackages:
    @remix-run/dev: ^2.3.1 => 2.3.1
    @remix-run/eslint-config: ^2.3.1 => 2.3.1
    @remix-run/react: ^2.3.1 => 2.3.1
    @remix-run/serve: ^2.3.1 => 2.3.1

Used Package Manager

npm

Expected Behavior

The .wasm stuff should load.

Actual Behavior

Error in terminal relating to: "No routes matched location "/build/routes/worker.js""

Error: No route matches URL "/build/routes/worker.js"
    at getInternalRouterError (/Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/router/router.ts:4377:5)
    at Object.query (/Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/router/router.ts:2856:19)
    at handleDocumentRequestRR (/Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/server-runtime/dist/server.js:168:35)
    at requestHandler (/Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/server-runtime/dist/server.js:93:24)
    at /Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/express/dist/server.js:42:28
No routes matched location "/build/routes/worker.js"
ErrorResponseImpl {
  status: 404,
  statusText: 'Not Found',
  internal: true,
  data: 'Error: No route matches URL "/build/routes/worker.js"',
  error: Error: No route matches URL "/build/routes/worker.js"
      at getInternalRouterError (/Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/router/router.ts:4377:5)
      at Object.query (/Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/router/router.ts:2856:19)
      at handleDocumentRequestRR (/Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/server-runtime/dist/server.js:168:35)
      at requestHandler (/Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/server-runtime/dist/server.js:93:24)
      at /Users/paulscanlon/Documents/Paulie/Dev Tests/remix-ffmpeg-wasm/node_modules/@remix-run/express/dist/server.js:42:28
}

[hi-ogawa]

I think this is because ffmpeg is hard-coding new URL("./worker.js", import.meta.url) https://github.com/ffmpegwasm/ffmpeg.wasm/blob/77a11fdc9c29b3c96969d9660c1f8181822b279d/packages/ffmpeg/src/classes.ts#L191 and this ends up requesting to /build/routes/worker.js due to the way Remix bundles assets.

Probably it's hard to get that working as is on Remix, so either you have to patch things up, or if you can wait, then there's already a PR to allow customizing the worker url ffmpegwasm/ffmpeg.wasm#639.

[PaulieScanlon]

Thank you for the info. I had a look at the PR. It seems like a relatively small change so fingers crossed it get merged in.

I can probably patch for now so I can carry on working but that's cool it's a known issue, with a suggested fix. I really wasn't sure where to start with this one.