Empty window.__federation_shared__

[xepozz]

Hello.
Read lot of comment around the issue, tried to combine all gathered information into dynamic remotes loader, it's too hard.
Faced with the problem that window.__federation_shared__ is not filling before the remotes tried to be initialized.
What I found is build generates the needed hash-map called moduleMap:

But I can't have access to the map in runtime.
Tried the way @foot wrote in the issue above:

if (!globalThis.__federation_shared__) {
    globalThis.__federation_shared__ = {};
}

var __federation__ = {
    ensure: async (remoteId) => {
        const remote = remotesMap[remoteId];
        if (remote.inited) {
            return remote.lib;
        }
        if (importTypes.includes(remote.format)) {
            // loading js with import(...)
            return new Promise((resolve) => {
                debugger;
                import(/* @vite-ignore */ remote.url).then((lib) => {
                    debugger;
                    console.log('lib', lib);
                    if (!remote.inited) {
                        lib.init(globalThis.__federation_shared__);
                        remote.lib = lib;
                        remote.inited = true;
                    }
                    resolve(remote.lib);
                });
            });
        }
    },
};

export const RemoteButton = React.lazy(async () => {
    debugger;
    remotesMap['remote'] = {
        url: 'http://localhost:3002/assets/external.js',
        format: 'esm',
    };

    const remote = await __federation__.ensure('remote');

    const factory = await remote.get('./LogPanel');

    const result = factory();
    return result.default ? result : {default: result};
});

Now it loads the remote component, but it fails because shared react wasn't loaded.
I've made research in built files and see that it loads react chunk, dev-tool confirms also

Let's look at the loader:

async function getSharedFromRuntime(name, shareScope) {
  let module = null;
  if (globalThis?.__federation_shared__?.[shareScope]?.[name]) {
    const versionObj = globalThis.__federation_shared__[shareScope][name];
    const versionKey = Object.keys(versionObj)[0];
    const versionValue = Object.values(versionObj)[0];
    if (moduleMap[name]?.requiredVersion) {
      // judge version satisfy
      if (satisfy(versionKey, moduleMap[name].requiredVersion)) {
        module = await (await versionValue.get())();
      } else {
        console.log(
          `provider support ${name}(${versionKey}) is not satisfied requiredVersion(\${moduleMap[name].requiredVersion})`
        );
      }
    } else {
      module = await (await versionValue.get())();
    }
  }
  if (module) {
    if (module.default) module = module.default;
    moduleCache[name] = module;
    return module
  }
}

Looks like it loads all shared libraries, but doesn't store them into the shared state globalThis?.__federation_shared__?.[shareScope].
Isn't it wrong behaviour?

[xepozz]

Anyone there? :)

[AsuraKev]

Anyone there? dependencies are not being shared as of today

[Faisal-Manzer]

Any solution for this @xepozz @AsuraKev ?
It seems like shared is redundant.

[AsuraKev]

Any solution for this @xepozz @AsuraKev ? It seems like shared is redundant.

My solution is that I am betting module federation on a new bundler called Rspack as it’s getting a new webpack modeller federation 1.1. Module federation seems to be still in an infancy stage in vite therefore I ll be building MFE on a framework called Modern JS