@umijs/plugins 4.0.0-beta.7 → 4.0.0-rc.2

package/libs/qiankun/slave/lifecycles.ts

@@ -0,0 +1,149 @@
+// @ts-nocheck
+/* eslint-disable */
+import { getPluginManager } from '@@/core/plugin';
+import ReactDOM from 'react-dom';
+import { ApplyPluginsType } from 'umi';
+import { setModelState } from './qiankunModel';
+
+const noop = () => {};
+
+type Defer = {
+  promise: Promise<any>;
+  resolve(value?: any): void;
+};
+
+// @ts-ignore
+const defer: Defer = {};
+defer.promise = new Promise((resolve) => {
+  defer.resolve = resolve;
+});
+
+let render = noop;
+let hasMountedAtLeastOnce = false;
+
+export default () => defer.promise;
+export const clientRenderOptsStack: any[] = [];
+
+// function normalizeHistory(
+//   history?: 'string' | Record<string, any>,
+//   base?: string,
+// ) {
+//   let normalizedHistory: Record<string, any> = {};
+//   if (base) normalizedHistory.basename = base;
+//   if (history) {
+//     if (typeof history === 'string') {
+//       normalizedHistory.type = history;
+//     } else {
+//       normalizedHistory = history;
+//     }
+//   }
+//
+//   return normalizedHistory;
+// }
+
+async function getSlaveRuntime() {
+  const config = await getPluginManager().applyPlugins({
+    key: 'qiankun',
+    type: ApplyPluginsType.modify,
+    initialValue: {},
+    async: true,
+  });
+  // 应用既是 master 又是 slave 的场景，运行时 slave 配置方式为 export const qiankun = { slave: {} }
+  const { slave } = config;
+  return slave || config;
+}
+
+export function genBootstrap(oldRender: typeof noop) {
+  return async (props: any) => {
+    const slaveRuntime = await getSlaveRuntime();
+    if (slaveRuntime.bootstrap) {
+      await slaveRuntime.bootstrap(props);
+    }
+    render = oldRender;
+  };
+}
+
+export function genMount(mountElementId: string) {
+  return async (props?: any) => {
+    // props 有值时说明应用是通过 lifecycle 被主应用唤醒的，而不是独立运行时自己 mount
+    if (typeof props !== 'undefined') {
+      setModelState(props);
+
+      const slaveRuntime = await getSlaveRuntime();
+      if (slaveRuntime.mount) {
+        await slaveRuntime.mount(props);
+      }
+
+      // 更新 clientRender 配置
+      const clientRenderOpts = {
+        // 默认开启
+        // 如果需要手动控制 loading，通过主应用配置 props.autoSetLoading false 可以关闭
+        callback: () => {
+          if (
+            props?.autoSetLoading &&
+            typeof props?.setLoading === 'function'
+          ) {
+            props.setLoading(false);
+          }
+
+          // // 支持将子应用的 history 回传给父应用
+          // if (typeof props?.onHistoryInit === 'function') {
+          //   props.onHistoryInit(history);
+          // }
+        },
+        // 支持通过 props 注入 container 来限定子应用 mountElementId 的查找范围
+        // 避免多个子应用出现在同一主应用时出现 mount 冲突
+        rootElement:
+          props?.container?.querySelector(`#${mountElementId}`) ||
+          mountElementId,
+
+        // 当存在同一个 umi 子应用在同一个页面被多实例渲染的场景时（比如一个页面里，同时展示了这个子应用的多个路由页面）
+        // mount 钩子会被调用多次，但是具体什么时候对应的实例开始 render 则是不定的，即它调用 applyPlugins('modifyClientRenderOpts') 的时机是不确定的
+        // 为了保证每次 applyPlugins('modifyClientRenderOpts') 调用是生成正确的 history，我们需要这里通过闭包上下文维持 mount 调用时的一些配置信息
+        // FIXME 由于 umi history 是全局的，通过 import { history } from 'umi' 调用的永远都是最后一个调用 createHistory 产生的对象，所以这种场景下会存在子应用内部获取 history 时，获取到的是同一个 history 的问题。这种场景下就不能直接从 umi import history，而应该从组件的 props 中取
+        // getHistory() {
+        //   // 动态改变 history
+        //   const historyOptions = normalizeHistory(props.history, props.base);
+        //   setCreateHistoryOptions(historyOptions);
+        //
+        //   // FIXME 子应用嵌入模式下不支持热更
+        //   return createHistory();
+        // },
+      };
+
+      clientRenderOptsStack.push(clientRenderOpts);
+    }
+
+    // 第一次 mount defer 被 resolve 后umi 会自动触发 render，非第一次 mount 则需手动触发
+    if (hasMountedAtLeastOnce) {
+      render();
+    } else {
+      defer.resolve();
+    }
+
+    hasMountedAtLeastOnce = true;
+  };
+}
+
+export function genUpdate() {
+  return async (props: any) => {
+    setModelState(props);
+    const slaveRuntime = await getSlaveRuntime();
+    if (slaveRuntime.update) {
+      await slaveRuntime.update(props);
+    }
+  };
+}
+
+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 slaveRuntime = await getSlaveRuntime();
+    if (slaveRuntime.unmount) await slaveRuntime.unmount(props);
+  };
+}

package/libs/qiankun/slave/qiankunModel.ts

@@ -0,0 +1,19 @@
+// @ts-nocheck
+/* eslint-disable */
+import { useState } from 'react';
+
+let initState: any;
+let setModelState = (val: any) => {
+  initState = val;
+};
+
+export default () => {
+  const [state, setState] = useState(initState);
+  setModelState = (val: any) => {
+    initState = val;
+    setState(val);
+  };
+  return state;
+};
+
+export { setModelState };

package/libs/qiankun/slave/slaveRuntimePlugin.ts

@@ -0,0 +1,21 @@
+// @ts-nocheck
+/* eslint-disable */
+import qiankunRender from './lifecycles';
+
+export function render(oldRender: any) {
+  return qiankunRender().then(oldRender);
+}
+
+// export function modifyClientRenderOpts(memo: any) {
+//   // 每次应用 render 的时候会调 modifyClientRenderOpts，这时尝试从队列中取 render 的配置
+//   const clientRenderOpts = clientRenderOptsStack.shift();
+//   if (clientRenderOpts) {
+//     const history = clientRenderOpts.getHistory();
+//     delete clientRenderOpts.getHistory;
+//     clientRenderOpts.history = history;
+//   }
+//   return {
+//     ...memo,
+//     ...clientRenderOpts,
+//   };
+// }

package/package.json

@@ -1,37 +1,53 @@
 {
   "name": "@umijs/plugins",
-  "version": "4.0.0-beta.7",
+  "version": "4.0.0-rc.2",
   "description": "@umijs/plugins",
+  "homepage": "https://github.com/umijs/umi-next/tree/master/packages/plugins#readme",
+  "bugs": "https://github.com/umijs/umi-next/issues",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/umijs/umi-next"
+  },
+  "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
-    "dist"
+    "dist",
+    "libs"
   ],
   "scripts": {
     "build": "pnpm tsc",
     "build:deps": "pnpm esno ../../scripts/bundleDeps.ts",
     "dev": "pnpm build -- --watch"
   },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/umijs/umi-next"
-  },
-  "authors": [
-    "chencheng <sorrycc@gmail.com> (https://github.com/sorrycc)"
-  ],
-  "license": "MIT",
-  "bugs": "https://github.com/umijs/umi-next/issues",
-  "homepage": "https://github.com/umijs/umi-next/tree/master/packages/plugins#readme",
-  "publishConfig": {
-    "access": "public"
-  },
   "dependencies": {
-    "antd": "^4.16.13",
+    "@ahooksjs/use-request": "^2.0.0",
+    "@ant-design/icons": "^4.7.0",
+    "@ant-design/pro-layout": "^6.32.14",
+    "@umijs/bundler-utils": "4.0.0-rc.2",
+    "antd": "^4.18.7",
     "antd-dayjs-webpack-plugin": "^1.0.6",
+    "axios": "^0.26.0",
     "babel-plugin-import": "^1.13.3",
-    "dayjs": "^1.10.7"
+    "dayjs": "^1.10.7",
+    "dva-core": "^2.0.4",
+    "event-emitter": "~0.3.5",
+    "fast-deep-equal": "3.1.3",
+    "lodash": "^4.17.21",
+    "moment": "^2.29.1",
+    "qiankun": "^2.6.3",
+    "react-intl": "3.12.1",
+    "react-redux": "^7.2.6",
+    "redux": "^4.1.2",
+    "warning": "^4.0.3"
   },
   "devDependencies": {
-    "umi": "4.0.0-beta.7"
-  }
+    "umi": "4.0.0-rc.2"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "authors": [
+    "chencheng <sorrycc@gmail.com> (https://github.com/sorrycc)"
+  ]
 }

package/dist/sass.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = (api) => {
-    api;
-};