@umijs/plugins 4.0.6 → 4.0.9

package/libs/qiankun/master/MicroApp.tsx

@@ -88,9 +88,16 @@ export const MicroApp = forwardRef(
       ...propsFromParams
     } = componentProps;
 
-    // 优先使用 alias 名匹配，fallback 到 name 匹配
-    const name = componentProps[appNameKeyAlias] || componentProps.name;
-    const isCurrentApp = (app: any) => app[appNameKeyAlias] === name || app.name === name;
+    // ref: https://github.com/umijs/plugins/pull/866
+    // name 跟 appNameKeyAlias 这两个 key 同时存在时，优先使用 name，避免对存量应用造成 breaking change。
+    // 比如 appNameKeyAlias 配置是 id，但之前 id 正好作为普通的 props 使用过，如 <MicroApp name="app" id="123" />
+    // 正常场景会优先匹配 appNameKeyAlias 对应的字段，fallback 到 name，避免对已经使用 <MicroApp name="app" /> 的应用造成影响
+    const name =
+      componentProps.name && componentProps[appNameKeyAlias]
+        ? componentProps.name
+        : componentProps[appNameKeyAlias] || componentProps.name;
+    const isCurrentApp = (app: any) =>
+      app[appNameKeyAlias] === name || app.name === name;
 
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState<any>(null);
@@ -143,13 +150,6 @@ export const MicroApp = forwardRef(
       setComponentError(null);
       setLoading(true);
       const configuration = {
-        fetch(url) {
-          return window.fetch(url, {
-            headers: {
-              accept: 'text/html',
-            },
-          });
-        },
         globalContext: window,
         ...globalSettings,
         ...settingsFromProps,
@@ -178,11 +178,16 @@ export const MicroApp = forwardRef(
           if (noneMounted) {
             if (Array.isArray(prefetch)) {
               const specialPrefetchApps = apps.filter(
-                (app) => !isCurrentApp(app) && (prefetch.indexOf(app[appNameKeyAlias]) !== -1 || prefetch.indexOf(app.name) !== -1)
+                (app) =>
+                  !isCurrentApp(app) &&
+                  (prefetch.indexOf(app[appNameKeyAlias]) !== -1 ||
+                    prefetch.indexOf(app.name) !== -1),
               );
               prefetchApps(specialPrefetchApps, configuration);
             } else {
-              const otherNotMountedApps = apps.filter((app) => !isCurrentApp(app));
+              const otherNotMountedApps = apps.filter(
+                (app) => !isCurrentApp(app),
+              );
               prefetchApps(otherNotMountedApps, configuration);
             }
             noneMounted = false;

package/libs/qiankun/slave/lifecycles.ts

@@ -1,7 +1,7 @@
 // @ts-nocheck
 import { getPluginManager } from '@@/core/plugin';
 import ReactDOM from 'react-dom';
-import { ApplyPluginsType } from 'umi';
+import { ApplyPluginsType, __getRoot } from 'umi';
 import { setModelState } from './qiankunModel';
 
 const noop = () => {};
@@ -73,6 +73,8 @@ export function genMount(mountElementId: string) {
         await slaveRuntime.mount(props);
       }
 
+      const { type, ...historyOpts } = props?.history || {};
+
       // 更新 clientRender 配置
       const clientRenderOpts = {
         // 默认开启
@@ -95,6 +97,10 @@ export function genMount(mountElementId: string) {
 
         basename: props.base,
 
+        // 支持 MicroAppWithMemoHistory 需要
+        historyType: type,
+        historyOpts: historyOpts,
+
         // 当存在同一个 umi 子应用在同一个页面被多实例渲染的场景时（比如一个页面里，同时展示了这个子应用的多个路由页面）
         // mount 钩子会被调用多次，但是具体什么时候对应的实例开始 render 则是不定的，即它调用 applyPlugins('modifyClientRenderOpts') 的时机是不确定的
         // 为了保证每次 applyPlugins('modifyClientRenderOpts') 调用是生成正确的 history，我们需要这里通过闭包上下文维持 mount 调用时的一些配置信息
@@ -143,12 +149,20 @@ export function genUpdate() {
 
 export function genUnmount(mountElementId: string) {
   return async (props: any) => {
-    const container = props?.container
-      ? props.container.querySelector(`#${mountElementId}`)
-      : document.getElementById(mountElementId);
-    if (container) {
-      ReactDOM.unmountComponentAtNode(container);
+    const root = __getRoot();
+
+    // support react 18 unmount
+    if (typeof root?.unmount === 'function') {
+      root.unmount();
+    } else {
+      const container = props?.container
+        ? props.container.querySelector(`#${mountElementId}`)
+        : document.getElementById(mountElementId);
+      if (container) {
+        ReactDOM.unmountComponentAtNode(container);
+      }
     }
+
     const slaveRuntime = await getSlaveRuntime();
     if (slaveRuntime.unmount) await slaveRuntime.unmount(props);
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/plugins",
-  "version": "4.0.6",
+  "version": "4.0.9",
   "description": "@umijs/plugins",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/plugins#readme",
   "bugs": "https://github.com/umijs/umi/issues",
@@ -16,16 +16,16 @@
     "libs"
   ],
   "scripts": {
-    "build": "pnpm tsc",
+    "build": "umi-scripts father build",
     "build:deps": "umi-scripts bundleDeps",
-    "dev": "pnpm build --watch",
+    "dev": "umi-scripts father dev",
     "test": "umi-scripts jest-turbo"
   },
   "dependencies": {
     "@ahooksjs/use-request": "^2.0.0",
     "@ant-design/icons": "^4.7.0",
-    "@ant-design/pro-layout": "^7.0.1-beta.20",
-    "@umijs/bundler-utils": "4.0.6",
+    "@ant-design/pro-layout": "^7.0.1-beta.28",
+    "@umijs/bundler-utils": "4.0.9",
     "antd-dayjs-webpack-plugin": "^1.0.6",
     "axios": "^0.27.2",
     "babel-plugin-import": "^1.13.5",
@@ -44,7 +44,7 @@
     "warning": "^4.0.3"
   },
   "devDependencies": {
-    "umi": "4.0.6"
+    "umi": "4.0.9"
   },
   "publishConfig": {
     "access": "public"