Host project with dynamic import on runtime

[alisonjr]

In webpack module federation it is possible to import components at runtime.

function loadComponent(scope, module) {
  return async () => {
    // Initializes the share scope. This fills it with known provided modules from this build and all remotes
    await __webpack_init_sharing__('default');
    const container = window[scope]; // or get the container somewhere else
    // Initialize the container, it may provide shared modules
    await container.init(__webpack_share_scopes__.default);
    const factory = await window[scope].get(module);
    const Module = factory();
    return Module;
  };
}

https://github.com/module-federation/module-federation-examples/blob/master/advanced-api/dynamic-remotes/app1/src/App.js

Is this project also possible? Is there any example?

[T0miii]

In my recent project im using it like this, this allows you to have dynamic (modules?) i guess. But the remotes still have to be hard coded in the vite.config

import { __federation_method_getRemote } from '__federation__'
const loadComponent = async () => {
  try {
    hasError.value = false
    remoteComponent.value = await __federation_method_getRemote(remote, module)
  } catch (error) {
    hasError.value = true
    console.error(error)
  }
}

What we are missing is a way to set the remotes at runtime, there is already a PR made by @foot , exposing a function that is doing that

#193 (reply in thread)

but we have no confirmation if it will make it.

[husayt]

latest release exposed these functions and I can confirm they work

[husayt]

Yes, it is now possible with latest release, also there is an updated example with that release.

[mahdihssni]

Could you put the example link here?
I can not find it!