@umijs/plugin-qiankun主应用如何配置

@umijs/plugin-qiankun 是一个用于在主应用中集成微前端应用的插件。要在主应用中使用该插件，需要进行以下配置：

1. 安装插件：

npm install @umijs/plugin-qiankun --save

2. 在.umirc.ts 或 config/config.ts 中进行配置：

export default {
  qiankun: {
    // 注册子应用信息
    apps: [
      {
        name: 'app1', // 子应用名称
        entry: '//localhost:8001', // 子应用入口 URL
        base: '/app1', // 子应用的基础路径
        mountElementId: 'app1', // 子应用挂载的 DOM 节点 ID
      },
      {
        name: 'app2',
        entry: '//localhost:8002',
        base: '/app2',
        mountElementId: 'app2',
      },
    ],
    // 预加载子应用
    prefetch: true,
    // 是否开启沙箱
    sandbox: true,
  },
};

其中，`apps` 为子应用列表，每个子应用包含以下属性：

- `name`：子应用名称，唯一标识符。
- `entry`：子应用入口 URL。
- `base`：子应用的基础路径。
- `mountElementId`：子应用挂载的 DOM 节点 ID。

`prefetch` 表示是否预加载子应用，`sandbox` 表示是否开启沙箱模式。

3. 在主应用的页面中使用 `qiankun` 组件进行渲染：

import React from 'react';
import { MicroApp, render } from 'umi';

export default function() {
  return (
    <div>
      <MicroApp name="app1" />
      <MicroApp name="app2" />
    </div>
  );
}

以上就是 @umijs/plugin-qiankun 在主应用中的配置过程。