@hhfenpm/micro-app 1.0.1 → 1.0.2

package/dist/index.esm.js

@@ -1,8 +1,3 @@
-/**
- * 微前端通信桥接
- * 支持父子应用之间的方法调用和通信
- */
-
 const BRIDGE$1 = {
   INVOKE: 'bridge-invoke',
   CALLBACK: 'bridge-callback',
@@ -24,27 +19,15 @@ const safeClone = value => {
   }
 };
 
-/**
- * 初始化通信桥接
- * @param {Object} options - 配置选项
- * @param {boolean} options.isParent - 是否为父应用，默认 false
- * @param {Object} options.vm - Vue 实例（可选）
- * @param {string} options.iframeSelector - iframe 选择器，默认 '#microApp'
- * @param {Object} options.handlers - 处理器对象（父应用需要提供）
- * @returns {void}
- */
 const initBridge = ({
   isParent = false,
   vm,
   iframeSelector = '#microApp',
   handlers = {},
 } = {}) => {
-  // 父应用使用传入的 handlers，子应用为空对象
   const finalHandlers = isParent ? handlers : Object.create(null);
-
   const pending = Object.create(null);
 
-  // 子应用：创建 $base 代理对象，用于调用父应用方法
   if (!isParent && vm) {
     vm.$base = new Proxy(
       {},
@@ -76,7 +59,6 @@ const initBridge = ({
     vm.$baseReady = true;
   }
 
-  // 处理来自子应用的调用请求（父应用）
   const handleInvoke = e => {
     const { action, params, callbackId } = e.data || {};
     if (!action || !callbackId) return
@@ -107,7 +89,6 @@ const initBridge = ({
     }
   };
 
-  // 处理来自父应用的响应（子应用）
   const handleCallback = e => {
     const { callbackId, result } = e.data || {};
     if (!callbackId || !pending[callbackId]) return
@@ -116,7 +97,6 @@ const initBridge = ({
     delete pending[callbackId];
   };
 
-  // 监听消息
   window.addEventListener('message', e => {
     if (e.origin !== window.location.origin) return
 
@@ -182,7 +162,6 @@ const KEYS = [
   'get_version',
 ];
 
-/** @param {Object} [electron] 宿主传入的 electron 模块，无或 require 失败时传 {} */
 function createCs(electron = {}) {
   const base = Object.fromEntries(
     KEYS.map(k => [k, typeof electron[k] === 'function' ? electron[k] : noop])
@@ -197,9 +176,6 @@ function createCs(electron = {}) {
   }
 }
 
-/**
- * @param {() => Object} [getElectron] 返回 electron 模块，如 () => require('@/utils/electron')
- */
 function createRegisterHandlers(getElectron) {
   let electron = {};
   try {
@@ -212,18 +188,6 @@ function createRegisterHandlers(getElectron) {
   })
 }
 
-/**
- * 微前端核心功能
- * 提供模块路由映射、URL 生成、部署检测等功能
- */
-
-/**
- * 创建微前端核心功能
- * @param {Object} options - 配置选项
- * @param {Function} options.modelMap - 模块路由映射函数，返回 { [moduleName]: string[] }
- * @param {Array<string>|Function} options.enabledModules - 启用的模块列表或获取模块列表的函数
- * @returns {Object} 核心功能对象
- */
 function createMicroAppCore({
   modelMap,
   enabledModules,
@@ -234,10 +198,6 @@ function createMicroAppCore({
 
   const MAP = modelMap();
 
-  /**
-   * 获取启用的模块列表
-   * @returns {Array<string>|null}
-   */
   const getEnabledModules = () => {
     if (Array.isArray(enabledModules)) {
       return enabledModules
@@ -245,18 +205,12 @@ function createMicroAppCore({
     if (typeof enabledModules === 'function') {
       return enabledModules()
     }
-    // 默认从 window.GLOBAL_CONFIG.microApp 获取
     if (typeof window !== 'undefined' && window.GLOBAL_CONFIG) {
       return window.GLOBAL_CONFIG.microApp || null
     }
     return null
   };
 
-  /**
-   * 根据路径获取对应的微前端模块名
-   * @param {string} path - 路由路径
-   * @returns {string|null} 模块名，如果不在任何模块中则返回 null
-   */
   const microAppModule = path => {
     const value = path.split('?')[0];
     const key = Object.keys(MAP).find(key => MAP[key].includes(value));
@@ -264,22 +218,12 @@ function createMicroAppCore({
     return DATA?.includes(key) ? key : null
   };
 
-  /**
-   * 生成微前端应用的完整 URL
-   * @param {string} path - 路由路径
-   * @returns {string} 完整的 URL
-   */
   const microAppSrc = path => {
     const module = microAppModule(path);
     const base = window.location.href.split('#')[0];
     return `${base}${module ? `${module}/` : ''}#${path}`
   };
 
-  /**
-   * 检测微前端模块是否已部署
-   * @param {string} module - 模块名
-   * @returns {Promise<boolean>} 是否已部署
-   */
   const microAppDeployed = async module => {
     try {
       const result = await fetch(`/${module}`, {
@@ -299,23 +243,6 @@ function createMicroAppCore({
   }
 }
 
-/**
- * 创建默认的微前端核心功能实例
- * 使用 window.GLOBAL_CONFIG.microApp 作为配置源
- * @param {Function} modelMap - 模块路由映射函数
- * @returns {Object} 核心功能对象
- */
-function createDefaultMicroAppCore(modelMap) {
-  return createMicroAppCore({
-    modelMap,
-  })
-}
-
-/**
- * Vuex 状态同步插件
- * 用于在父子应用之间同步 Vuex store 状态
- */
-
 const MESSAGE = {
   SYNC_FROM_CHILD: 'sync-base-from-child',
   SYNC_FROM_PARENT: 'sync-base-from-parent',
@@ -369,13 +296,6 @@ const syncRouteFromChild = fullPath => {
   }
 };
 
-/**
- * 创建状态同步插件
- * @param {Object} options - 配置选项
- * @param {boolean} options.isParent - 是否为父应用，默认 false
- * @param {string} options.iframeSelector - iframe 选择器，默认 '#microApp'
- * @returns {Function} Vuex 插件函数
- */
 function baseSyncPlugin({
   isParent = false,
   iframeSelector = '#microApp',
@@ -383,7 +303,6 @@ function baseSyncPlugin({
   return store => {
     let latestBaseState = store.state.base;
 
-    // 监听 base 状态变化，自动同步
     store.watch(
       state => state.base,
       newBase => {
@@ -403,7 +322,6 @@ function baseSyncPlugin({
       { deep: true }
     );
 
-    // 附加路由同步功能（子应用使用）
     store.attachRouterSync = router => {
       if (!router || isParent) return
       router.afterEach(to => {
@@ -423,7 +341,6 @@ function baseSyncPlugin({
       });
     };
 
-    // 调用微前端生命周期（父应用使用）
     store.callMicroAppLifeCycle = (type, payload) => {
       if (!isParent) return
       if (!isLifeCycleMessage(type)) return
@@ -434,30 +351,25 @@ function baseSyncPlugin({
       });
     };
 
-    // 处理消息
     const handleMessage = event => {
       if (event.origin !== window.location.origin) return
       const { type, payload, fullPath } = event.data || {};
 
-      // 子应用处理生命周期消息
       if (!isParent && isLifeCycleMessage(type)) {
         window.__MICRO_APP_LIFECYCLE__?.[type]?.(payload);
         return
       }
 
-      // 父应用处理来自子应用的状态同步
       if (isParent && type === MESSAGE.SYNC_FROM_CHILD) {
         store.commit('base/SYNC_STATE', payload);
         return
       }
 
-      // 子应用处理来自父应用的状态同步
       if (!isParent && type === MESSAGE.SYNC_FROM_PARENT) {
         store.commit('base/SYNC_STATE', payload);
         return
       }
 
-      // 父应用响应子应用的状态请求
       if (isParent && type === MESSAGE.REQUEST_FROM_CHILD) {
         postToChild(iframeSelector, {
           type: MESSAGE.SYNC_FROM_PARENT,
@@ -466,13 +378,11 @@ function baseSyncPlugin({
         return
       }
 
-      // 父应用处理子应用的路由变化
       if (isParent && type === MESSAGE.CHILD_ROUTE_CHANGE) {
         syncRouteFromChild(fullPath);
         return
       }
 
-      // 父应用转发其他消息到父窗口
       if (isParent && !isInternalMessage(type) && !isBridgeMessage(type)) {
         window.parent?.postMessage(event.data || {}, '*');
       }
@@ -480,23 +390,12 @@ function baseSyncPlugin({
 
     window.addEventListener('message', handleMessage);
 
-    // 子应用初始化时请求父应用状态
     if (!isParent && window.parent) {
       postToParent({ type: MESSAGE.REQUEST_FROM_CHILD });
     }
   }
 }
 
-/**
- * @hhfenpm/micro-app
- * 微前端通信桥接和状态同步工具
- */
-
-
-var index = {
-  initBridge,
-  createDefaultMicroAppCore,
-  baseSyncPlugin,
-};
+var index = { initBridge, baseSyncPlugin };
 
-export { baseSyncPlugin, createDefaultMicroAppCore, createMicroAppCore, createRegisterHandlers, index as default, initBridge };
+export { baseSyncPlugin, createMicroAppCore, createRegisterHandlers, index as default, initBridge };

package/dist/index.js

@@ -2,11 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-/**
- * 微前端通信桥接
- * 支持父子应用之间的方法调用和通信
- */
-
 const BRIDGE$1 = {
   INVOKE: 'bridge-invoke',
   CALLBACK: 'bridge-callback',
@@ -28,27 +23,15 @@ const safeClone = value => {
   }
 };
 
-/**
- * 初始化通信桥接
- * @param {Object} options - 配置选项
- * @param {boolean} options.isParent - 是否为父应用，默认 false
- * @param {Object} options.vm - Vue 实例（可选）
- * @param {string} options.iframeSelector - iframe 选择器，默认 '#microApp'
- * @param {Object} options.handlers - 处理器对象（父应用需要提供）
- * @returns {void}
- */
 const initBridge = ({
   isParent = false,
   vm,
   iframeSelector = '#microApp',
   handlers = {},
 } = {}) => {
-  // 父应用使用传入的 handlers，子应用为空对象
   const finalHandlers = isParent ? handlers : Object.create(null);
-
   const pending = Object.create(null);
 
-  // 子应用：创建 $base 代理对象，用于调用父应用方法
   if (!isParent && vm) {
     vm.$base = new Proxy(
       {},
@@ -80,7 +63,6 @@ const initBridge = ({
     vm.$baseReady = true;
   }
 
-  // 处理来自子应用的调用请求（父应用）
   const handleInvoke = e => {
     const { action, params, callbackId } = e.data || {};
     if (!action || !callbackId) return
@@ -111,7 +93,6 @@ const initBridge = ({
     }
   };
 
-  // 处理来自父应用的响应（子应用）
   const handleCallback = e => {
     const { callbackId, result } = e.data || {};
     if (!callbackId || !pending[callbackId]) return
@@ -120,7 +101,6 @@ const initBridge = ({
     delete pending[callbackId];
   };
 
-  // 监听消息
   window.addEventListener('message', e => {
     if (e.origin !== window.location.origin) return
 
@@ -186,7 +166,6 @@ const KEYS = [
   'get_version',
 ];
 
-/** @param {Object} [electron] 宿主传入的 electron 模块，无或 require 失败时传 {} */
 function createCs(electron = {}) {
   const base = Object.fromEntries(
     KEYS.map(k => [k, typeof electron[k] === 'function' ? electron[k] : noop])
@@ -201,9 +180,6 @@ function createCs(electron = {}) {
   }
 }
 
-/**
- * @param {() => Object} [getElectron] 返回 electron 模块，如 () => require('@/utils/electron')
- */
 function createRegisterHandlers(getElectron) {
   let electron = {};
   try {
@@ -216,18 +192,6 @@ function createRegisterHandlers(getElectron) {
   })
 }
 
-/**
- * 微前端核心功能
- * 提供模块路由映射、URL 生成、部署检测等功能
- */
-
-/**
- * 创建微前端核心功能
- * @param {Object} options - 配置选项
- * @param {Function} options.modelMap - 模块路由映射函数，返回 { [moduleName]: string[] }
- * @param {Array<string>|Function} options.enabledModules - 启用的模块列表或获取模块列表的函数
- * @returns {Object} 核心功能对象
- */
 function createMicroAppCore({
   modelMap,
   enabledModules,
@@ -238,10 +202,6 @@ function createMicroAppCore({
 
   const MAP = modelMap();
 
-  /**
-   * 获取启用的模块列表
-   * @returns {Array<string>|null}
-   */
   const getEnabledModules = () => {
     if (Array.isArray(enabledModules)) {
       return enabledModules
@@ -249,18 +209,12 @@ function createMicroAppCore({
     if (typeof enabledModules === 'function') {
       return enabledModules()
     }
-    // 默认从 window.GLOBAL_CONFIG.microApp 获取
     if (typeof window !== 'undefined' && window.GLOBAL_CONFIG) {
       return window.GLOBAL_CONFIG.microApp || null
     }
     return null
   };
 
-  /**
-   * 根据路径获取对应的微前端模块名
-   * @param {string} path - 路由路径
-   * @returns {string|null} 模块名，如果不在任何模块中则返回 null
-   */
   const microAppModule = path => {
     const value = path.split('?')[0];
     const key = Object.keys(MAP).find(key => MAP[key].includes(value));
@@ -268,22 +222,12 @@ function createMicroAppCore({
     return DATA?.includes(key) ? key : null
   };
 
-  /**
-   * 生成微前端应用的完整 URL
-   * @param {string} path - 路由路径
-   * @returns {string} 完整的 URL
-   */
   const microAppSrc = path => {
     const module = microAppModule(path);
     const base = window.location.href.split('#')[0];
     return `${base}${module ? `${module}/` : ''}#${path}`
   };
 
-  /**
-   * 检测微前端模块是否已部署
-   * @param {string} module - 模块名
-   * @returns {Promise<boolean>} 是否已部署
-   */
   const microAppDeployed = async module => {
     try {
       const result = await fetch(`/${module}`, {
@@ -303,23 +247,6 @@ function createMicroAppCore({
   }
 }
 
-/**
- * 创建默认的微前端核心功能实例
- * 使用 window.GLOBAL_CONFIG.microApp 作为配置源
- * @param {Function} modelMap - 模块路由映射函数
- * @returns {Object} 核心功能对象
- */
-function createDefaultMicroAppCore(modelMap) {
-  return createMicroAppCore({
-    modelMap,
-  })
-}
-
-/**
- * Vuex 状态同步插件
- * 用于在父子应用之间同步 Vuex store 状态
- */
-
 const MESSAGE = {
   SYNC_FROM_CHILD: 'sync-base-from-child',
   SYNC_FROM_PARENT: 'sync-base-from-parent',
@@ -373,13 +300,6 @@ const syncRouteFromChild = fullPath => {
   }
 };
 
-/**
- * 创建状态同步插件
- * @param {Object} options - 配置选项
- * @param {boolean} options.isParent - 是否为父应用，默认 false
- * @param {string} options.iframeSelector - iframe 选择器，默认 '#microApp'
- * @returns {Function} Vuex 插件函数
- */
 function baseSyncPlugin({
   isParent = false,
   iframeSelector = '#microApp',
@@ -387,7 +307,6 @@ function baseSyncPlugin({
   return store => {
     let latestBaseState = store.state.base;
 
-    // 监听 base 状态变化，自动同步
     store.watch(
       state => state.base,
       newBase => {
@@ -407,7 +326,6 @@ function baseSyncPlugin({
       { deep: true }
     );
 
-    // 附加路由同步功能（子应用使用）
     store.attachRouterSync = router => {
       if (!router || isParent) return
       router.afterEach(to => {
@@ -427,7 +345,6 @@ function baseSyncPlugin({
       });
     };
 
-    // 调用微前端生命周期（父应用使用）
     store.callMicroAppLifeCycle = (type, payload) => {
       if (!isParent) return
       if (!isLifeCycleMessage(type)) return
@@ -438,30 +355,25 @@ function baseSyncPlugin({
       });
     };
 
-    // 处理消息
     const handleMessage = event => {
       if (event.origin !== window.location.origin) return
       const { type, payload, fullPath } = event.data || {};
 
-      // 子应用处理生命周期消息
       if (!isParent && isLifeCycleMessage(type)) {
         window.__MICRO_APP_LIFECYCLE__?.[type]?.(payload);
         return
       }
 
-      // 父应用处理来自子应用的状态同步
       if (isParent && type === MESSAGE.SYNC_FROM_CHILD) {
         store.commit('base/SYNC_STATE', payload);
         return
       }
 
-      // 子应用处理来自父应用的状态同步
       if (!isParent && type === MESSAGE.SYNC_FROM_PARENT) {
         store.commit('base/SYNC_STATE', payload);
         return
       }
 
-      // 父应用响应子应用的状态请求
       if (isParent && type === MESSAGE.REQUEST_FROM_CHILD) {
         postToChild(iframeSelector, {
           type: MESSAGE.SYNC_FROM_PARENT,
@@ -470,13 +382,11 @@ function baseSyncPlugin({
         return
       }
 
-      // 父应用处理子应用的路由变化
       if (isParent && type === MESSAGE.CHILD_ROUTE_CHANGE) {
         syncRouteFromChild(fullPath);
         return
       }
 
-      // 父应用转发其他消息到父窗口
       if (isParent && !isInternalMessage(type) && !isBridgeMessage(type)) {
         window.parent?.postMessage(event.data || {}, '*');
       }
@@ -484,27 +394,15 @@ function baseSyncPlugin({
 
     window.addEventListener('message', handleMessage);
 
-    // 子应用初始化时请求父应用状态
     if (!isParent && window.parent) {
       postToParent({ type: MESSAGE.REQUEST_FROM_CHILD });
     }
   }
 }
 
-/**
- * @hhfenpm/micro-app
- * 微前端通信桥接和状态同步工具
- */
-
-
-var index = {
-  initBridge,
-  createDefaultMicroAppCore,
-  baseSyncPlugin,
-};
+var index = { initBridge, baseSyncPlugin };
 
 exports.baseSyncPlugin = baseSyncPlugin;
-exports.createDefaultMicroAppCore = createDefaultMicroAppCore;
 exports.createMicroAppCore = createMicroAppCore;
 exports.createRegisterHandlers = createRegisterHandlers;
 exports.default = index;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hhfenpm/micro-app",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "微前端通信桥接和状态同步工具，支持父子应用通信、状态同步、生命周期管理",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",