feat(plugin-qiankun): 主应用支持路由上配置微应用

packages/fes-plugin-layout/src/index.js

@@ -79,7 +79,6 @@ export default (api) => {
     api.addRuntimePlugin(() => `@@/${absRuntimeFilePath}`);
 
     // 把BaseLayout插入到路由配置中，作为根路由
-    // TODO: fes缺少修改路由API
     api.modifyRoutes(routes => [
         {
             path: '/',

packages/fes-plugin-qiankun/src/main/index.js

@@ -1,6 +1,7 @@
 import { readFileSync } from 'fs';
 import { join } from 'path';
 import { defaultMainRootId, defaultHistoryType } from '../constants';
+import modifyRoutes from './modifyRoutes';
 
 const namespace = 'plugin-qiankun/main';
 
@@ -21,9 +22,12 @@ export default function (api) {
         mountElementId: defaultMainRootId
     }));
 
+    modifyRoutes({ api, namespace });
+
     const absMicroAppPath = join(namespace, 'MicroApp.js');
     const absRuntimePath = join(namespace, 'runtime.js');
     const absMasterOptionsPath = join(namespace, 'masterOptions.js');
+    const absGetMicroAppRouteCompPath = join(namespace, 'getMicroAppRouteComponent.js');
 
     api.onGenerateFiles(() => {
         api.writeTmpFile({
@@ -36,6 +40,10 @@ export default function (api) {
             content: readFileSync(join(__dirname, 'runtime/runtime.tpl'), 'utf-8')
         });
 
+        api.writeTmpFile({
+            path: absGetMicroAppRouteCompPath,
+            content: readFileSync(join(__dirname, 'runtime/getMicroAppRouteComponent.tpl'), 'utf-8')
+        });
 
         const { main: options } = api.config?.qiankun || {};
         const masterHistoryType = api.config?.router?.mode || defaultHistoryType;
@@ -61,6 +69,13 @@ export default function (api) {
         }
     ]);
 
+    api.addPluginExports(() => [
+        {
+            specifiers: ['getMicroAppRouteComponent'],
+            source: absGetMicroAppRouteCompPath
+        }
+    ]);
+
 
     // const { registerRuntimeKeyInIndex = false } = options || {};
 

packages/fes-plugin-qiankun/src/main/modifyRoutes.js

@@ -0,0 +1,58 @@
+import { defaultHistoryType } from '../constants';
+
+function getMicroApp(options) {
+    const {
+        microAppName, masterHistoryType, base, namespace, ...normalizedRouteProps
+    } = options;
+    return `(() => {
+const { getMicroAppRouteComponent } = require('@@/${namespace}/getMicroAppRouteComponent');
+return getMicroAppRouteComponent({ appName: '${microAppName}', base: '${base}', masterHistoryType: '${masterHistoryType}', routeProps: ${JSON.stringify(normalizedRouteProps)} })
+})()`;
+}
+
+function modifyRoutesWithAttachMode({
+    routes, masterHistoryType, base, namespace
+}) {
+    const patchRoutes = (_routes) => {
+        if (_routes.length) {
+            _routes.forEach((route) => {
+                if (route.meta && route.meta.microApp) {
+                    route.component = getMicroApp({
+                        microAppName: route.meta.microApp,
+                        masterHistoryType,
+                        base,
+                        namespace
+                    });
+                }
+                if (route.children?.length) {
+                    modifyRoutesWithAttachMode({
+                        routes: route.children,
+                        masterHistoryType,
+                        base,
+                        namespace
+                    });
+                }
+            });
+        }
+    };
+
+    patchRoutes(routes);
+
+    return routes;
+}
+
+export default function modifyRoutes({ api, namespace }) {
+    api.modifyRoutes((routes) => {
+        const { router, base } = api.config;
+        const masterHistoryType = (router && router?.mode) || defaultHistoryType;
+
+        modifyRoutesWithAttachMode({
+            routes,
+            masterHistoryType,
+            base: base || '/',
+            namespace
+        });
+
+        return routes;
+    });
+}

packages/fes-plugin-qiankun/src/main/runtime/getMicroAppRouteComponent.tpl

@@ -0,0 +1,11 @@
+import { MicroApp } from './MicroApp';
+
+export function getMicroAppRouteComponent({
+  appName,
+  base,
+  masterHistoryType,
+  routeProps
+}) {
+
+  return <MicroApp base={base} masterHistoryType={masterHistoryType} name={appName} {...routeProps} />;
+}