How can I load compiled files from a subfolder?

[Evolveye]

How can I load compiled files from a subfolder?

I want to create a project with such file architecture:

/webassembly/
    ├ index.html
    ├ css/
    ├ js/
    └ wasm/
        ├ example.cpp
        ├ example.js (generated by emscripten)
        └ example.wasm (generated by emscripten)

I'm using that emcc command syntax:

I'm loading example.js file by that markup:

Finally, the console is showing me that error:

I did some research, but I didn't find any way to solve that problem.
Keeping all files in the root directory isn't good idea :/

[juj]

You can define a custom function in the Module object to specify how the compiled output downloads files relative to the main .js file. In your shell file:

Module.locateFile = function(url) { return 'wasm/'+url; };

Currently the semantics are to treat relative URLs to be processed relative to the document's baseURI (the location of the .html file). There is a proposal to make relative URLs be treated relative to the .js file instead of being relative to the baseURI, but that's a semantically breaking change so has not yet proceeded; see #5484, #5368 (these relate to fixing another similar issue in node.js so the conversation ranges)

[Evolveye]

Great!

For future embarrassed people:

<script> window.Module = { locateFile: url => `./path/${url}`} </script>
<script src="./path/compiled.js"></script>

---

Well, i have included the script, but now console is showing me that warning:

I read about it, but nobody find the solution. Do You know how can I fix that?

[juj]

Check out this recent emscripten-discuss thread: https://groups.google.com/d/msg/emscripten-discuss/C7-i1gqWay4/x2sSl2qmBQAJ

[froydnj]

@kripken or @juj, it looks like this issue has been addressed; can we close it?

[kripken]

Yeah, and I see we already have docs on the wiki.

[chase-moskal]

@Evolveye

i attempted to use your solution, however, even though the emscripten module is picking up locateFile, i can see that locateFile is never actually being called or used

	window.Module = {
		locateFile: url => {
			console.log("LOCATE", url)
			debugger
			return `./path/${url}`
		}
	}

the emscripten module is looking for webp.wasm and webp.js.mem at the server root, which is the wrong location, and i'm trying to influence the emscripten module to look at the location relative to the emscripten module -- but emscripten appears to be ignoring my locateFile definition

i can see in the debugger that emscripten is initially picking up my Module definition here, but i don't know why it's not being called