fix: call initializeSharing before load remote while shareStrategy is version first (#3212)

Author: 2heal1

.changeset/nervous-tomatoes-marry.md

@@ -0,0 +1,6 @@
+---
+'@module-federation/webpack-bundler-runtime': patch
+'@module-federation/runtime': patch
+---
+
+fix: initializeSharing before load remote while shareStrategy is version first

packages/runtime/src/remote/index.ts

@@ -197,7 +197,9 @@ export class RemoteHandler {
   ): Promise<T | null> {
     const { host } = this;
     try {
-      const { loadFactory = true } = options || { loadFactory: true };
+      const { loadFactory = true } = options || {
+        loadFactory: true,
+      };
       // 1. Validate the parameters of the retrieved module. There are two module request methods: pkgName + expose and alias + expose.
       // 2. Request the snapshot information of the current host and globally store the obtained snapshot information. The retrieved module information is partially offline and partially online. The online module information will retrieve the modules used online.
       // 3. Retrieve the detailed information of the current module from global (remoteEntry address, expose resource address)

packages/webpack-bundler-runtime/src/remotes.ts

@@ -105,10 +105,22 @@ export function remotes(options: RemotesOptions) {
           );
 
           const remoteModuleName = remoteName + data[1].slice(1);
-          return webpackRequire.federation.instance!.loadRemote(
-            remoteModuleName,
-            { loadFactory: false, from: 'build' },
-          );
+          const instance = webpackRequire.federation.instance!;
+          const loadRemote = () =>
+            webpackRequire.federation.instance!.loadRemote(remoteModuleName, {
+              loadFactory: false,
+              from: 'build',
+            });
+
+          if (instance.options.shareStrategy === 'version-first') {
+            return Promise.all(
+              instance.sharedHandler.initializeSharing(data[0]),
+            ).then(() => {
+              return loadRemote();
+            });
+          }
+
+          return loadRemote();
         } catch (error) {
           onError(error as Error);
         }