Help with an issue of code splitting in a dependency

[stuartlynn]

I am looking for some help or advice with an issue that might be a limitation with CRA, something I am doing wrong or a bug.

I hitting a situation in which importing a wasm module asynchronously works fine if I do it directly from CRA but if I go through an intermediate module, it cant find the javascript async chunk to load in at runtime.

I put together a minimal example replicating the issue here : https://github.com/stuartlynn/cra-async-issue

The set up is

1. A wasm module @wasm/wasm-func which is being built with webpack and the wasm_pack plugin. It has a single function greet() which just triggers an alert

2. A component library module @components/components which is also being built with webpack. The library imports the WASM module and provides a function to access it. In the real version of this it actually does stuff with the WASM module but this is enough to demo the issue

3. A CRA app which imports the component module and calls the method that uses the WASM module.

If I import the wasm module directly in to the CRA it works fine, persuasively because the code splitting is happening at the CRA level. However if I import the component library and call the wasm function from there, it attempts to read in the async code split chunk from /static/js/ but CRA isn't hosting anything there.

Is there a way to get this to work? I feel like I need to somehow change the webpack config of the component library but after a lot of googling and trial and error I am at a bit of loss.

Any help would be much appreciated.