@lemon-fe/vite-plugin-micro-frontend 1.0.8 → 1.1.0

package/dist/runtime.d.ts

@@ -16,7 +16,14 @@ interface QiankunWindow {
     [x: string]: any;
 }
 declare const qiankunWindow: QiankunWindow;
-declare const renderWithQiankun: (qiankunLifeCycle: QiankunLifeCycle) => void;
+/**
+ * 渲染乾坤微应用
+ * 自动从 index.html 中查找第一个带 id 的 div 作为挂载容器
+ * @param qiankunLifeCycle 生命周期钩子
+ */
+declare const renderWithQiankun: (
+/** 生命周期钩子 */
+qiankunLifeCycle: QiankunLifeCycle) => void;
 
 interface DynamicOptions<P = Record<string, unknown>> {
     /** 动态加载函数，返回一个包含 default 导出的 Promise */
@@ -28,7 +35,6 @@ interface DynamicOptions<P = Record<string, unknown>> {
 }
 /**
  * 封装动态导入函数，兼容 Umi 的 dynamic
- *
  */
 declare function dynamic<P = Record<string, unknown>>(options: DynamicOptions<P>): ComponentType<P>;
 

package/dist/runtime.js

@@ -1,4 +1,4 @@
-import require$$0, { createElement, Suspense, lazy, Component } from 'react';
+import require$$0, { lazy, createElement, Suspense, Component } from 'react';
 import { qiankunWindow as qiankunWindow$1, renderWithQiankun as renderWithQiankun$1 } from 'vite-plugin-qiankun/es/helper';
 
 function getDefaultExportFromCjs (x) {
@@ -27761,7 +27761,26 @@ var ReactDOM = /*@__PURE__*/getDefaultExportFromCjs(reactDomExports);
  * 这个文件不应该包含任何 Node.js 模块
  */
 const qiankunWindow = qiankunWindow$1;
-const renderWithQiankun = (qiankunLifeCycle) => {
+/**
+ * 查找当前微应用的挂载容器
+ * @param container 乾坤传入的容器（可选）
+ */
+function findAppRoot(container) {
+    // 乾坤环境：只从当前微应用的沙箱容器中查找，避免找到其他微应用的容器
+    if (container) {
+        return container.querySelector("div[id]");
+    }
+    // 独立运行（非乾坤环境）：从 document.body 中查找
+    return document.body.querySelector("div[id]");
+}
+/**
+ * 渲染乾坤微应用
+ * 自动从 index.html 中查找第一个带 id 的 div 作为挂载容器
+ * @param qiankunLifeCycle 生命周期钩子
+ */
+const renderWithQiankun = (
+/** 生命周期钩子 */
+qiankunLifeCycle) => {
     renderWithQiankun$1({
         mount(props) {
             return new Promise((resolve, reject) => {
@@ -27784,8 +27803,11 @@ const renderWithQiankun = (qiankunLifeCycle) => {
             return new Promise((resolve, reject) => {
                 try {
                     const { container } = props;
-                    const mountRoot = container?.querySelector("#wms");
-                    ReactDOM.unmountComponentAtNode(mountRoot || document.querySelector("#wms"));
+                    const mountElement = findAppRoot(container);
+                    if (!mountElement) {
+                        throw new Error("No div with id found in index.html");
+                    }
+                    ReactDOM.unmountComponentAtNode(mountElement);
                     resolve();
                 }
                 catch (error) {
@@ -27855,15 +27877,16 @@ class DynamicErrorBoundary extends Component {
 }
 /**
  * 封装动态导入函数，兼容 Umi 的 dynamic
- *
  */
 function dynamic(options) {
+    // lazy 在外层调用，只创建一次，保证组件引用稳定（keepAlive 依赖此特性）
+    const LazyComponent = lazy(options.loader);
     const LoadingComponent = options.loading;
     return function DynamicComponent(props) {
         const loadingElement = LoadingComponent
             ? createElement(LoadingComponent)
             : null;
-        return createElement(DynamicErrorBoundary, { LoadingComponent }, createElement(Suspense, { fallback: loadingElement }, createElement(lazy(options.loader), props)));
+        return createElement(DynamicErrorBoundary, { LoadingComponent }, createElement(Suspense, { fallback: loadingElement }, createElement(LazyComponent, props)));
     };
 }