UMI.md

• 内置了路由、构建、部署、测试等，它还提供针对 React 的集成插件集，满足日常开发需求。
• 支持配置式路由和约定式路由，路由数据加载简化请求操作（useClientLoaderData）,在三层嵌套路由的场景可以实现并行请求数据
• 默认支持less,代码一件生成，umi lint代码检查

在普通的 Umi 应用中，默认 不附带任何插件 ，如需使用 Max 的功能（如 数据流、antd 等），需要手动安装插件并开启他们：

pnpm add -D @umijs/plugins

// .umirc.ts
export default {
  plugins: ['@umijs/plugins/dist/antd'],
  antd: {}
}

配置式路由

配置式路由是指通过编写一个路由配置文件来定义路由规则的方式。开发者需要明确地指定每个路由的路径、组件以及可能的其他配置项。这种方式的优点是路由结构清晰，易于管理和维护，特别是在大型项目中，可以方便地查看和修改路由配置。

约定式路由

指通过约定的文件和目录结构来自动推断路由规则的方式。在这种方式下，开发者不需要显式地编写路由配置，而是通过文件和目录的结构来定义路由。这种方式的优点是减少了配置工作，使得项目结构更加直观。约定式路由通常通过在 src/pages 目录下创建对应的文件和文件夹来实现。UmiJS 会根据这些文件和文件夹的结构自动生成路由配置。

代理

http-proxy-middleware

export default {
  proxy: {
    '/api': {
      'target': 'http://jsonplaceholder.typicode.com/',
      'changeOrigin': true,
      'pathRewrite': { '^/api' : '' },
    },
  },
}

UmiJS 实现微前端

的方式主要依赖于其插件系统和约定式路由。以下方式实现微前端：

实现步骤

1. 安装微前端插件：首先，你需要安装 UmiJS 的微前端插件，如 @umijs/plugin-micro-app。

2. 配置主应用：在主应用中，你需要配置微前端插件，指定子应用的加载方式、通信机制等。

3. 创建子应用：每个子应用都是一个独立的 UmiJS 应用，你需要按照约定的目录结构和插件配置来开发子应用。

4. 加载子应用：在主应用中，你可以通过约定的路由或插件提供的 API 来加载和卸载子应用。

5. 应用间通信：使用插件提供的通信机制来实现子应用之间的数据共享和事件通信。

通过以上步骤，你可以在 UmiJS 中实现微前端架构，将一个大型应用拆分成多个独立的子应用，每个子应用可以独立开发和部署，从而提高应用的可维护性和可扩展性。