@bm-fe/react-native-multi-bundle 1.0.0-beta.0 → 1.0.0-beta.10

package/scripts/build-multi-bundle.js

@@ -13,17 +13,41 @@
  * - --env: 'development' | 'staging' | 'production' (默认: 'production')
  * 
  * 环境变量：
- * - PROJECT_ROOT: 项目根目录（可选，默认从脚本位置推断）
+ * - PROJECT_ROOT: 项目根目录（可选，默认从当前工作目录向上查找包含 multi-bundle.config.json 的目录）
  */
 
 const fs = require('fs');
 const path = require('path');
 const { execSync } = require('child_process');
 
-// 支持从任意项目目录运行
-// 如果作为 npm 包使用，PROJECT_ROOT 应该是调用脚本的项目根目录
-// 如果直接运行，PROJECT_ROOT 是脚本所在目录的父目录
-const PROJECT_ROOT = process.env.PROJECT_ROOT || path.join(__dirname, '..');
+/**
+ * 查找项目根目录
+ * 从当前工作目录向上查找，直到找到包含 multi-bundle.config.json 的目录
+ * 如果找不到，则使用当前工作目录（通常打包命令在项目根目录执行）
+ */
+function findProjectRoot() {
+  // 如果通过环境变量指定，直接使用
+  if (process.env.PROJECT_ROOT) {
+    return process.env.PROJECT_ROOT;
+  }
+  
+  // 从当前工作目录开始向上查找
+  let currentDir = process.cwd();
+  const root = path.parse(currentDir).root;
+  
+  while (currentDir !== root) {
+    const configFile = path.join(currentDir, 'multi-bundle.config.json');
+    if (fs.existsSync(configFile)) {
+      return currentDir;
+    }
+    currentDir = path.dirname(currentDir);
+  }
+  
+  // 如果找不到配置文件，使用当前工作目录（通常打包命令在项目根目录执行）
+  return process.cwd();
+}
+
+const PROJECT_ROOT = findProjectRoot();
 const CONFIG_FILE = path.join(PROJECT_ROOT, 'multi-bundle.config.json');
 const OUTPUT_DIR = path.join(PROJECT_ROOT, 'build/bundles');
 
@@ -176,6 +200,7 @@ function removePreludeFromBundle(bundlePath) {
 function ensureOutputDir(platform) {
   const platformDir = path.join(OUTPUT_DIR, platform);
   const modulesDir = path.join(platformDir, 'modules');
+  const assetsDir = path.join(platformDir, 'assets');
   
   if (!fs.existsSync(platformDir)) {
     fs.mkdirSync(platformDir, { recursive: true });
@@ -183,6 +208,9 @@ function ensureOutputDir(platform) {
   if (!fs.existsSync(modulesDir)) {
     fs.mkdirSync(modulesDir, { recursive: true });
   }
+  if (!fs.existsSync(assetsDir)) {
+    fs.mkdirSync(assetsDir, { recursive: true });
+  }
   
   return platformDir;
 }
@@ -209,6 +237,16 @@ function buildBundle(entryFile, outputFile, platform, env = 'development', progr
   // ⭐ 关键：判断是否是模块 bundle（通过检查 entry 路径）
   const isModuleBundle = entry.includes('src/modules/');
   
+  // 计算 assets 输出目录（统一放在平台目录下的 assets 文件夹）
+  const platformDir = path.dirname(outputFile);
+  const assetsDest = path.join(platformDir, 'assets');
+  const assetsDestRelative = path.relative(PROJECT_ROOT, assetsDest);
+  
+  // 确保 assets 目录存在
+  if (!fs.existsSync(assetsDest)) {
+    fs.mkdirSync(assetsDest, { recursive: true });
+  }
+  
   const commandParts = [
     // 主 bundle 和模块 bundle 都设置 RN_MULTI_BUNDLE_BUILD，但使用不同的 RN_BUILD_TYPE
     'RN_MULTI_BUNDLE_BUILD=true',
@@ -218,6 +256,7 @@ function buildBundle(entryFile, outputFile, platform, env = 'development', progr
     `--bundle-output ${out}`,
     `--platform ${platform}`,
     `--dev ${dev}`,
+    `--assets-dest ${assetsDestRelative}`,
     '--reset-cache',
   ];
   

package/scripts/sync-bundles-to-assets.js

@@ -4,8 +4,8 @@
  * 同步 Bundle 到 Assets 目录脚本
  * 将构建好的 bundle 文件同步到 Android/iOS 的 assets 目录
  * 
- * Android: android/app/src/main/assets/bundles/
- * iOS: ios/DemoProject/RNModules/Bundles/
+ * Android: android/app/src/main/assets/
+ * iOS: ios/DemoProject/Bundles/
  */
 
 const fs = require('fs');
@@ -14,7 +14,7 @@ const path = require('path');
 const PROJECT_ROOT = path.join(__dirname, '..');
 const BUILD_DIR = path.join(PROJECT_ROOT, 'build/bundles');
 const ANDROID_ASSETS_DIR = path.join(PROJECT_ROOT, 'android/app/src/main/assets');
-const IOS_ASSETS_DIR = path.join(PROJECT_ROOT, 'ios/DemoProject/RNModules/Bundles');
+const IOS_ASSETS_DIR = path.join(PROJECT_ROOT, 'ios/DemoProject/Bundles');
 
 /**
  * ANSI 颜色工具函数

package/src/multi-bundle/LocalBundleManager.ts

@@ -56,14 +56,37 @@ function convertNativeManifestToBundleManifest(nativeManifest: any): BundleManif
 
 /**
  * 获取当前激活包的 manifest
- * - 开发环境：从开发服务器获取 manifest（HTTP 模式）
- * - 生产环境：从 Native CodePush 模块获取 manifest（直接返回 JSON 对象）
+ * - 优先从 Native 模块获取（支持 CodePush 等热更新场景）
+ * - 如果 Native 返回 null，在开发环境下降级到开发服务器获取
+ * - 生产环境下如果 Native 返回 null，抛出异常
  */
 async function getCurrentBundleManifest(): Promise<BundleManifest> {
   // 生产环境：从 Native 模块获取 manifest
-  if (!__DEV__) {
-    try {
-      const nativeManifest = await NativeModules.CodePush.getCurrentBundleManifestContent();
+//   if (!__DEV__) {
+//     try {
+//       const nativeManifest = await NativeModules.ModuleLoader.getCurrentBundleManifestContent();
+//       if (nativeManifest) {
+//         return convertNativeManifestToBundleManifest(nativeManifest);
+//       } else {
+//         // Native 模块返回 null 或 undefined
+//         throw new Error(
+//           '[LocalBundleManager] Native module returned null manifest. ' +
+//           'Please ensure bundle-manifest.json exists in the app bundle.'
+//         );
+//       }
+//     } catch (error) {
+//       console.error(
+//         `[LocalBundleManager] Failed to get manifest from Native: ${error}`
+//       );
+//       // 生产环境无法获取 manifest 时抛出异常
+//       throw new Error(
+//         `[LocalBundleManager] Failed to get manifest from Native module: ${error}`
+//       );
+//     }
+//   }
+      console.log("ReactNativeJS","nativeManifest getCurrentBundleManifestContent")
+      const nativeManifest = await NativeModules.ModuleLoader.getCurrentBundleManifestContent();
+      console.log("ReactNativeJS","nativeManifest "+nativeManifest)
       if (nativeManifest) {
         return convertNativeManifestToBundleManifest(nativeManifest);
       } else {
@@ -73,16 +96,6 @@ async function getCurrentBundleManifest(): Promise<BundleManifest> {
           'Please ensure bundle-manifest.json exists in the app bundle.'
         );
       }
-    } catch (error) {
-      console.error(
-        `[LocalBundleManager] Failed to get manifest from Native: ${error}`
-      );
-      // 生产环境无法获取 manifest 时抛出异常
-      throw new Error(
-        `[LocalBundleManager] Failed to get manifest from Native module: ${error}`
-      );
-    }
-  }
 
   // 开发环境：从开发服务器获取 manifest
   const config = getGlobalConfig();

package/src/multi-bundle/ModuleLoaderMock.ts

@@ -9,6 +9,7 @@
 
 import { Platform } from 'react-native';
 import { HMRClient } from './HMRClient';
+import { getGlobalConfig } from './config';
 
 interface LoadResult {
   success: boolean;
@@ -22,29 +23,117 @@ const loadedBundles = new Set<string>();
 // 正在加载中的 bundle（并发复用）
 const inflightBundles = new Map<string, Promise<LoadResult>>();
 
+// 缓存 multi-bundle.config.json（开发环境）
+let cachedMultiBundleConfig: any = null;
+let configLoadPromise: Promise<any> | null = null;
+
+/**
+ * 从开发服务器获取 multi-bundle.config.json
+ */
+async function getMultiBundleConfig(): Promise<any> {
+  // 如果已缓存，直接返回
+  if (cachedMultiBundleConfig) {
+    return cachedMultiBundleConfig;
+  }
+  
+  // 如果正在加载，等待加载完成
+  if (configLoadPromise) {
+    return configLoadPromise;
+  }
+  
+  // 开始加载配置
+  configLoadPromise = (async () => {
+    try {
+      const config = getGlobalConfig();
+      const devServer = config?.devServer;
+      const host = devServer?.host || (Platform.OS === 'android' ? '10.0.2.2' : 'localhost');
+      const port = devServer?.port || 8081;
+      const protocol = devServer?.protocol || 'http';
+      
+      const configUrl = `${protocol}://${host}:${port}/multi-bundle.config.json`;
+      const response = await fetch(configUrl);
+      
+      if (response.ok) {
+        const configData = await response.json();
+        cachedMultiBundleConfig = configData;
+        return configData;
+      } else {
+        console.warn(
+          `[ModuleLoaderMock] Failed to fetch multi-bundle.config.json: HTTP ${response.status}`
+        );
+        return null;
+      }
+    } catch (error) {
+      console.warn(
+        `[ModuleLoaderMock] Failed to fetch multi-bundle.config.json: ${error}`
+      );
+      return null;
+    } finally {
+      configLoadPromise = null;
+    }
+  })();
+  
+  return configLoadPromise;
+}
+
 /**
- * 根据 bundleId 构建 HTTP URL（开发环境）
+ * 根据 bundlePath 构建 HTTP URL（开发环境 HTTP 模式）
  * 
- * 在开发环境中，我们通过 Metro bundler 的 HTTP 服务器加载 bundle
- * 根据 bundleId 直接构建对应的 HTTP URL
+ * 优先从 multi-bundle.config.json 的 entry 字段获取模块路径
+ * 如果无法获取，则使用 bundlePath 进行简单推断
+ * 
+ * @param bundleId 模块 ID
+ * @param bundlePath bundle 文件路径（从 manifest 中获取，开发环境可能不使用）
  */
-function buildHttpUrlFromBundleId(bundleId: string): string {
-  const host = Platform.OS === 'android' ? '10.0.2.2' : 'localhost';
+async function buildHttpUrlFromBundlePath(bundleId: string, bundlePath: string): Promise<string> {
+  const config = getGlobalConfig();
+  const devServer = config?.devServer;
+  const host = devServer?.host || (Platform.OS === 'android' ? '10.0.2.2' : 'localhost');
+  const port = devServer?.port || 8081;
+  const protocol = devServer?.protocol || 'http';
   
-  // 简单的模块 ID 到目录名的映射
-  // 假设模块 ID 为小写，目录名为首字母大写
-  // 例如: home -> Home
-  const moduleName = bundleId.charAt(0).toUpperCase() + bundleId.slice(1);
+  // 优先从 multi-bundle.config.json 的 entry 获取模块路径
+  let sourcePath: string | null = null;
+  
+  try {
+    const multiBundleConfig = await getMultiBundleConfig();
+    if (multiBundleConfig?.modules) {
+      const moduleConfig = multiBundleConfig.modules.find((m: any) => m.id === bundleId);
+      if (moduleConfig?.entry) {
+        sourcePath = moduleConfig.entry;
+      }
+    }
+  } catch (error) {
+    console.warn(
+      `[ModuleLoaderMock] Failed to get entry from multi-bundle.config.json for module ${bundleId}: ${error}`
+    );
+  }
+  
+  // 如果无法从配置文件获取，使用 bundlePath 进行简单推断
+  if (!sourcePath) {
+    // 如果 bundlePath 已经是源码路径，直接使用
+    if (bundlePath.startsWith('src/') || bundlePath.startsWith('./src/')) {
+      sourcePath = bundlePath;
+    } else {
+      // 生产环境路径（如 bundles/home/index.bundle），提取模块名
+      const match = bundlePath.match(/(?:bundles\/|modules\/)(?:[^/]+\/)?([^/]+)\//);
+      const moduleName = match?.[1] || bundleId.charAt(0).toUpperCase() + bundleId.slice(1);
+      sourcePath = `src/modules/${moduleName}/index.bundle`;
+    }
+  }
+  
+  // 确保路径以 .bundle 结尾
+  if (!sourcePath.endsWith('.bundle')) {
+    sourcePath = sourcePath.replace(/\.(ts|tsx|js|jsx)$/, '.bundle') || sourcePath + '/index.bundle';
+  }
   
   // 构建 Metro 请求 URL
-  // 请求源码入口文件，Metro 会自动打包
-  // 注意：使用 .bundle 后缀，Metro 会识别并构建对应的 .ts/.tsx 文件
-  return `http://${host}:8081/src/modules/${moduleName}/index.bundle` +
+  return `${protocol}://${host}:${port}/${sourcePath}` +
      `?platform=${Platform.OS}` +
      `&dev=true` +
      `&minify=false` +
-     `&modulesOnly=true` +      // ✅ 只生成 __d(...)，不带 runtime
-     `&runModule=true`;         // ✅ 不自动执行入口
+     `&modulesOnly=true` +
+     `&runModule=true`;
 }
 
 /**
@@ -74,8 +163,8 @@ async function loadBusinessBundle(bundleId: string, bundlePath: string): Promise
       };
     }
 
-    // 开发环境：根据 bundleId 构建 HTTP URL
-    const httpUrl = buildHttpUrlFromBundleId(bundleId);
+    // 开发环境：根据 bundlePath 动态构建 HTTP URL（优先从 multi-bundle.config.json 获取 entry）
+    const httpUrl = await buildHttpUrlFromBundlePath(bundleId, bundlePath);
 
     // 已经加载过的 bundle，不再重复执行
     if (loadedBundles.has(httpUrl)) {
@@ -166,4 +255,3 @@ export const ModuleLoader = {
 };
 
 export type { LoadResult };
-

package/src/multi-bundle/ModuleRegistry.ts

@@ -137,8 +137,6 @@ function registerModule(moduleId: string, exportsObj: any): void {
     return;
   }
 
-  map[moduleId] = 1;
-
   moduleExports[moduleId] = exportsObj;
   moduleState[moduleId] = 'loaded';
 
@@ -222,7 +220,7 @@ async function loadModule(moduleId: string): Promise<void> {
             loader = NativeModules.ModuleLoader;
           } else {
             throw new Error(
-              'ModuleLoader not available: Native CodePush module not found in production'
+              'ModuleLoader not available: Native ModuleLoader module not found in production'
             );
           }
         }

package/src/multi-bundle/README.md

@@ -341,3 +341,5 @@ function preloadModule(moduleId: string): Promise<void>
 - [使用指南](../docs/使用指南.md)
 - [多 Bundle 架构设计](../docs/React%20Native%20多%20bundle%20技术方案.md)
 
+
+

package/src/multi-bundle/init.ts

@@ -18,6 +18,10 @@ export interface InitResult {
   manifest?: BundleManifest;
 }
 
+// 初始化状态标记
+let isInitialized = false;
+let initPromise: Promise<InitResult> | null = null;
+
 /**
  * 从 manifestProvider 获取 manifest
  */
@@ -53,6 +57,7 @@ async function getManifestFromProvider(
  * 初始化多 Bundle 系统
  * 
  * @param config 配置对象
+ * @param forceReinit 是否强制重新初始化（默认 false，已初始化时直接返回成功结果）
  * @returns 初始化结果
  * 
  * @example
@@ -64,68 +69,106 @@ async function getManifestFromProvider(
  * });
  * ```
  */
-export async function initMultiBundle(config: MultiBundleConfig = {}): Promise<InitResult> {
-  try {
-    // 1. 合并配置
-    const mergedConfig = mergeConfig(config);
-    
-    // 2. 设置全局配置（供 Metro 配置等使用）
-    setGlobalConfig(mergedConfig);
-
-    // 2.5 初始化 HMR Client (开发环境)
-    if (__DEV__ && mergedConfig.devServer) {
-      HMRClient.getInstance().setup(
-        mergedConfig.devServer.host,
-        mergedConfig.devServer.port
-      );
-    }
+export async function initMultiBundle(
+  config: MultiBundleConfig = {},
+  forceReinit: boolean = false
+): Promise<InitResult> {
+  // 如果已经初始化且不强制重新初始化，直接返回成功
+  if (isInitialized && !forceReinit) {
+    return {
+      success: true,
+      manifest: undefined, // 不返回 manifest，因为已经初始化过了
+    };
+  }
+
+  // 如果正在初始化，等待正在进行的初始化完成
+  if (initPromise && !forceReinit) {
+    return initPromise;
+  }
 
-    // 3. 获取 manifest
-    let manifest: BundleManifest;
+  // 开始新的初始化
+  initPromise = (async () => {
     try {
-      manifest = await getManifestFromProvider(mergedConfig.manifestProvider);
+      // 1. 合并配置
+      const mergedConfig = mergeConfig(config);
+      
+      // 2. 设置全局配置（供 Metro 配置等使用）
+      setGlobalConfig(mergedConfig);
+
+      // 2.5 初始化 HMR Client (开发环境)
+      if (__DEV__ && mergedConfig.devServer) {
+        HMRClient.getInstance().setup(
+          mergedConfig.devServer.host,
+          mergedConfig.devServer.port
+        );
+      }
+
+      // 3. 获取 manifest
+      let manifest: BundleManifest;
+      try {
+        manifest = await getManifestFromProvider(mergedConfig.manifestProvider);
+      } catch (error) {
+        const err = error instanceof Error ? error : new Error(String(error));
+        console.error('[initMultiBundle] Failed to get manifest:', err);
+        config.onError?.(err);
+        return {
+          success: false,
+          error: err,
+        };
+      }
+
+      // 4. 设置自定义 ModuleLoader（如果提供）
+      if (mergedConfig.moduleLoader) {
+        ModuleRegistry.setModuleLoader(mergedConfig.moduleLoader);
+      }
+
+      // 5. 初始化 ModuleRegistry
+      ModuleRegistry.init({ manifest });
+
+      // 6. 预加载模块
+      if (mergedConfig.preloadModules && mergedConfig.preloadModules.length > 0) {
+        const preloadPromises = mergedConfig.preloadModules.map((moduleId) =>
+          preloadModule(moduleId).catch((error) => {
+            // 预加载失败不影响初始化，只记录日志
+            console.warn(`[initMultiBundle] Preload module ${moduleId} failed:`, error);
+            config.onError?.(error instanceof Error ? error : new Error(String(error)));
+          })
+        );
+        await Promise.allSettled(preloadPromises);
+      }
+
+      isInitialized = true;
+      return {
+        success: true,
+        manifest,
+      };
     } catch (error) {
       const err = error instanceof Error ? error : new Error(String(error));
-      console.error('[initMultiBundle] Failed to get manifest:', err);
+      console.error('[initMultiBundle] Initialization failed:', err);
       config.onError?.(err);
+      // 初始化失败时，允许下次重试
+      isInitialized = false;
+      initPromise = null;
       return {
         success: false,
         error: err,
       };
+    } finally {
+      // 如果强制重新初始化，清除 promise（允许下次调用）
+      if (forceReinit) {
+        initPromise = null;
+      }
     }
+  })();
 
-    // 4. 设置自定义 ModuleLoader（如果提供）
-    if (mergedConfig.moduleLoader) {
-      ModuleRegistry.setModuleLoader(mergedConfig.moduleLoader);
-    }
-
-    // 5. 初始化 ModuleRegistry
-    ModuleRegistry.init({ manifest });
-
-    // 6. 预加载模块
-    if (mergedConfig.preloadModules && mergedConfig.preloadModules.length > 0) {
-      const preloadPromises = mergedConfig.preloadModules.map((moduleId) =>
-        preloadModule(moduleId).catch((error) => {
-          // 预加载失败不影响初始化，只记录日志
-          console.warn(`[initMultiBundle] Preload module ${moduleId} failed:`, error);
-          config.onError?.(error instanceof Error ? error : new Error(String(error)));
-        })
-      );
-      await Promise.allSettled(preloadPromises);
-    }
+  return initPromise;
+}
 
-    return {
-      success: true,
-      manifest,
-    };
-  } catch (error) {
-    const err = error instanceof Error ? error : new Error(String(error));
-    console.error('[initMultiBundle] Initialization failed:', err);
-    config.onError?.(err);
-    return {
-      success: false,
-      error: err,
-    };
-  }
+/**
+ * 重置初始化状态（用于测试或特殊场景）
+ */
+export function resetInitState(): void {
+  isInitialized = false;
+  initPromise = null;
 }