Ensure base path is available in client app for including static assets at runtime

Should be trivial. Drupal core does this too. See \Drupal\system\Hook\SystemHooks::jsSettingsAlter().

Passing the base path to the React app is trivial. Getting whatever library @swc/wasm-web uses to fetch the WASM file at runtime to use the path will be the potentially tricky part. 🙂 (Same with tailwindcss-in-browser which uses lightningcss-wasm.)

During the POC, I was able to get this work only by setting the base config option in our Vite config. So we should be able to investigate what that sets that's accessible at runtime.

👍

I think we can use Rollup's replace plugin here (unless I don't understand the problem).

We can use __DRUPAL_XB_BASE_PATH__ in all of our code and in our viteconfig we can pass config to rollup plugin replace to replace that with a reference to a global, e.g. drupalSettings.xbBasePath that we ensure is always available on the page via #attached

Opened the source code of @swc/wasm-web and it has this

async function __wbg_init(module_or_path) {
    if (wasm !== undefined) return wasm;


    if (typeof module_or_path !== 'undefined') {
        if (Object.getPrototypeOf(module_or_path) === Object.prototype) {
            ({module_or_path} = module_or_path)
        } else {
            console.warn('using deprecated parameters for the initialization function; pass a single object instead')
        }
    }

    if (typeof module_or_path === 'undefined') {
        module_or_path = new URL('wasm_bg.wasm', import.meta.url);
    }
    const imports = __wbg_get_imports();

    if (typeof module_or_path === 'string' || (typeof Request === 'function' && module_or_path instanceof Request) || (typeof URL === 'function' && module_or_path instanceof URL)) {
        module_or_path = fetch(module_or_path);
    }

    __wbg_init_memory(imports);

    const { instance, module } = await __wbg_load(await module_or_path, imports);

    return __wbg_finalize_init(instance, module);
}

export { initSync };
export default __wbg_init;

so the default export takes a module_or_path

We're calling it with no arguments

But we should be able to pass in the path there and it will end up with

module_or_path = fetch(module_or_path);

#6: 📌 Ensure base path is available in client app for including static assets at runtime Active That would mean it's defined at build time, which is what we're trying to avoid. It's because people may install the XB module under any path, and not necessarily with the path of e.g. /modules/contrib/experience_builder.

#7 📌 Ensure base path is available in client app for including static assets at runtime Active : Promising! Maybe we can give that a go in the ongoing MR for ✨ Preview for code components Active , if it's that simple. I have a vague memory that I tried the same while working on the POC, but I may have missed something. Be sure to test with npm run build as well.

Automatically closed - issue fixed for 2 weeks with no activity.