Vercel WASM deployment issues

[wesbos]

I am using a @ffmpeg.wasm/main to concatenate the audio files before sending off for transcription.

It uses a .wasm file that when built, isn't being included in the vercel function.

I've tried the following code:

import { join } from 'path';
import { FFmpeg } from '@ffmpeg.wasm/main';
import core from '@ffmpeg.wasm/core-mt';
import wasmPathAb from '@ffmpeg.wasm/core-mt/dist/core.wasm?url';

const wasmPath = join(process.cwd(), wasmPathAb);
const ffmpeg = await FFmpeg.create({
	core: core,
	coreOptions: {
		wasmPath: wasmPath
	},
});

And that successfully includes the file in the vercel output. but this error persists:

RuntimeError: Aborted(Error: ENOENT: no such file or directory, open '/var/task/_app/immutable/assets/core.5838ff71.wasm'). Build with -sASSERTIONS for more info.

The file is confirmed at that path (in the vercel output), but the function is unable to access it at runtime.

Not sure how to force it to include that file in the function. Any ideas?

Related:

sveltejs/kit#10594
sveltejs/kit#8441

[wesbos]

Still struggling with this one. It seems vercel needs the asset path to be statically analyzable. But even with this code:

const wasmPath = _dirname + '/../assets/core.wasm';

it still can't reference it, but I see the hashed file in the output tab at _app/immutable/assets/

[wesbos]

Related blog post: https://www.themosaad.com/blog/loading-static-file-remix-vercel

[wesbos]

As an update, this seemesly has nothing to do with ESM/CJS or even the fact that it's a wasm file as I can't even get it to work with an SVG and the instructions here. I just need to know how do I get vercel to include a file in the built function?

[wesbos]

I tried that - same issue - vercel doesn't know to bundle it with the function. If I understand the issue, putting it in the public / assets folder makes it a vercel CDN asset, and its not available in the function environment.

[sandrinjoy]

no, u should be able to access any files public.
public/wasm/test.wasm

www.url.com/wasm/test.wasm
why wouldn't this be accessible?

[wesbos]

Oh an external URL - might be worth trying.

I did just have some progress with copying files on build, which gives me an idea - working on confirming it works..

[wesbos]

I have the file being moved into the function now manually post-build. Kind of silly because it copies a 23mb wasm file into EVERY serverless function, but that seems to now make it available.

Thanks to:

https://twitter.com/dimfeld/status/1714684628802699436

code: https://github.com/dimfeld/website/blob/master/copy_content_to_build_destination.mjs

[dimfeld]

With a bit of extra work you can figure out the exact function you need, by looking at .vercel/output/config.json. Here's an excerpt of config.json from building my website repo above, and you can see the mapping from the src route to the dest function that ends up handling the route.

{
  "version": 3,
  "routes": [
                // Removed a bunch of other routes for brevity.
		{
			"src": "^/notes/([^/]+?)\\.og-image\\.png/?(?:/__data.json)?$",
			"dest": "/fn-0"
		},
		{
			"src": "^/plas/event/?(?:/__data.json)?$",
			"dest": "/fn-1"
		},
		{
			"src": "^/plas/script\\.js/?(?:/__data.json)?$",
			"dest": "/fn-1"
		},
		{
			"src": "^/repl/([^/]+?)\\.json/?(?:/__data.json)?$",
			"dest": "/fn-0"
		},
		{
			"src": "^/writing/([^/]+?)\\.og-image\\.png/?(?:/__data.json)?$",
			"dest": "/fn-0"
		}
  ]
}

[wesbos]

Thanks again @dimfeld - your fix was the ticket!