@module-federation/bridge-vue3 0.16.0 → 0.17.1

package/package.json

@@ -7,7 +7,7 @@
     "url": "https://github.com/module-federation/core",
     "directory": "packages/vue3-bridge"
   },
-  "version": "0.16.0",
+  "version": "0.17.1",
   "publishConfig": {
     "access": "public"
   },
@@ -32,11 +32,12 @@
     "vue-router": "=4"
   },
   "dependencies": {
-    "@module-federation/bridge-shared": "0.16.0",
-    "@module-federation/sdk": "0.16.0",
-    "@module-federation/runtime": "0.16.0"
+    "@module-federation/bridge-shared": "0.17.1",
+    "@module-federation/sdk": "0.17.1",
+    "@module-federation/runtime": "0.17.1"
   },
   "devDependencies": {
+    "@types/react": "^18.3.11",
     "@vitejs/plugin-vue": "^5.0.4",
     "@vitejs/plugin-vue-jsx": "^4.0.0",
     "typescript": "^5.2.2",

package/src/create.ts

@@ -5,7 +5,7 @@ import { LoggerInstance } from './utils.js';
 
 declare const __APP_VERSION__: string;
 
-export function createRemoteComponent(info: {
+export function createRemoteAppComponent(info: {
   loader: () => Promise<any>;
   export?: string;
   asyncComponentOptions?: Omit<AsyncComponentOptions, 'loader'>;
@@ -29,17 +29,20 @@ export function createRemoteComponent(info: {
       }
 
       const exportName = info?.export || 'default';
-      LoggerInstance.debug(`createRemoteComponent LazyComponent create >>>`, {
-        basename,
-        info,
-      });
+      LoggerInstance.debug(
+        `createRemoteAppComponent LazyComponent create >>>`,
+        {
+          basename,
+          info,
+        },
+      );
 
       const module: any = await info.loader();
       const moduleName = module && module[Symbol.for('mf_module_id')];
       const exportFn = module[exportName];
 
       LoggerInstance.debug(
-        `createRemoteComponent LazyComponent loadRemote info >>>`,
+        `createRemoteAppComponent LazyComponent loadRemote info >>>`,
         { moduleName, module, exportName, basename, route },
       );
 
@@ -59,3 +62,18 @@ export function createRemoteComponent(info: {
     },
   });
 }
+
+/**
+ * @deprecated createRemoteAppComponent is deprecated, please use createRemoteAppComponent instead!
+ */
+export function createRemoteComponent(info: {
+  loader: () => Promise<any>;
+  export?: string;
+  asyncComponentOptions?: Omit<AsyncComponentOptions, 'loader'>;
+  rootAttrs?: Record<string, unknown>;
+}) {
+  LoggerInstance.warn(
+    'createRemoteAppComponent is deprecated, please use createRemoteAppComponent instead!',
+  );
+  return createRemoteAppComponent(info);
+}

package/src/index.ts

@@ -1,3 +1,3 @@
 export { createBridgeComponent } from './provider';
-export { createRemoteComponent } from './create';
+export { createRemoteComponent, createRemoteAppComponent } from './create';
 export type { RenderFnParams } from '@module-federation/bridge-shared';

package/src/remoteApp.tsx

@@ -43,7 +43,7 @@ export default defineComponent({
         hashRoute: props.hashRoute,
       };
       LoggerInstance.debug(
-        `createRemoteComponent LazyComponent render >>>`,
+        `createRemoteAppComponent LazyComponent render >>>`,
         renderProps,
       );
 
@@ -67,7 +67,7 @@ export default defineComponent({
         // dispatchPopstateEnv
         if (pathname.value !== '' && pathname.value !== newPath) {
           LoggerInstance.debug(
-            `createRemoteComponent dispatchPopstateEnv >>>`,
+            `createRemoteAppComponent dispatchPopstateEnv >>>`,
             {
               ...props,
               pathname: route.path,
@@ -84,9 +84,12 @@ export default defineComponent({
     });
 
     onBeforeUnmount(() => {
-      LoggerInstance.debug(`createRemoteComponent LazyComponent destroy >>>`, {
-        ...props,
-      });
+      LoggerInstance.debug(
+        `createRemoteAppComponent LazyComponent destroy >>>`,
+        {
+          ...props,
+        },
+      );
       watchStopHandle();
 
       hostInstance?.bridgeHook?.lifecycle?.beforeBridgeDestroy?.emit({