generator-mico-cli 0.2.13 → 0.2.14

package/generators/micro-react/templates/apps/layout/docs/common-intl.md

@@ -0,0 +1,370 @@
+# 通用国际化库使用指南
+
+## 概述
+
+`@portal-web/common-intl` 是 Portal 项目的通用国际化（i18n）库，用于管理多语言文案，支持从多语言中台拉取翻译数据。
+
+## 适用场景
+
+- 应用需要支持多语言切换（中文、英文、阿拉伯语、土耳其语等）
+- 需要从多语言中台动态获取翻译文案
+- 希望统一管理国际化逻辑，减少重复代码
+
+## 核心特性
+
+| 特性       | 说明                                             |
+| ---------- | ------------------------------------------------ |
+| 跨端兼容   | 通过外部注入 `messageInstance`，适配不同 UI 框架 |
+| 离线缓存   | 支持 IndexedDB + 内存双重缓存                    |
+| 插值替换   | 支持 `%AA%`、`%BB%` 等动态占位符                 |
+| 降级兜底   | 翻译缺失时自动返回默认文案                       |
+| 微前端共享 | 主应用获取文案后，子应用可直接使用               |
+
+## 两种使用模式
+
+根据应用架构的不同，`@portal-web/common-intl` 支持两种使用模式：
+
+| 模式         | 适用场景                                         | 示例应用                                                     |
+| ------------ | ------------------------------------------------ | ------------------------------------------------------------ |
+| 微前端模式   | qiankun 主子应用架构，主应用获取文案后子应用共享 | layout、conversation-v2、session、workorder、faq、permission |
+| 独立应用模式 | 独立运行的应用，自己获取和管理文案               | mico-cs-mobile                                               |
+
+### 微前端模式
+
+在 qiankun 微前端架构中，**主应用负责获取文案**，子应用直接使用共享的文案对象，无需重复初始化。
+
+**工作原理**：
+
+- 主应用调用 `initIntl()` 获取远程文案
+- 文案数据存储到 `window.__MICO_COMMON_INTL_TRANSLATIONS__`
+- 子应用直接使用 `intl` 对象，自动从 window 读取共享数据
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    apps/layout（主应用）                      │
+│  ┌─────────────────────────────────────────────────────────┐│
+│  │ initIntl() → 请求远程文案 → 存储到 window 对象           ││
+│  └─────────────────────────────────────────────────────────┘│
+└─────────────────────────────────────────────────────────────┘
+                              ↓
+        ┌─────────────────────┼─────────────────────┐
+        ↓                     ↓                     ↓
+┌───────────────┐   ┌───────────────┐   ┌───────────────┐
+│ conversation  │   │    session    │   │   workorder   │
+│   子应用      │   │    子应用     │   │    子应用     │
+│ import {intl} │   │ import {intl} │   │ import {intl} │
+│ 直接使用      │   │ 直接使用      │   │ 直接使用      │
+└───────────────┘   └───────────────┘   └───────────────┘
+```
+
+**主应用配置（apps/layout/src/app.tsx）**：
+
+```typescript
+import {
+  getCurrentLocale,
+  initIntl,
+  type ILang,
+} from "@portal-web/common-intl";
+import { Message } from "@arco-design/web-react";
+import { request } from "@umijs/max";
+
+// 初始化国际化模块
+const fetchMultilingualData = initIntl({
+  requestInstance: request,
+  messageInstance: {
+    error: (msg: string) => Message.error(msg),
+    warning: (msg: string) => Message.warning(msg),
+  },
+  fetchMultilingualDataParams: {
+    tag: "cs_fe_pc",
+    lang: getCurrentLocale() as ILang,
+    app_name: "middle",
+  },
+  indexedDBParams: {
+    dbName: "mico_cs_web_i18n_db",
+  },
+});
+
+// 在应用渲染前加载多语言数据
+export function render(oldRender: () => void): void {
+  fetchMultilingualData()
+    .then(oldRender)
+    .catch((error: Error) => {
+      console.error("获取多语言文案失败", error);
+      oldRender(); // 失败时继续渲染，使用兜底文案
+    });
+}
+```
+
+**子应用使用（无需初始化）**：
+
+```typescript
+// apps/conversation-v2、apps/session、apps/workorder 等子应用
+import { intl } from "@portal-web/common-intl";
+
+// 直接使用，文案来自主应用
+<h1>{intl.cs_web_workbench_conversation_record()}</h1>;
+```
+
+### 独立应用模式
+
+对于非 qiankun 架构的独立应用（如 H5 应用），需要自己调用 `initIntl()` 获取文案，并维护独立的文案文件。
+
+**独立应用配置（apps/mico-cs-mobile/src/app.ts）**：
+
+```typescript
+import { initIntl } from "@portal-web/common-intl";
+import { Toast } from "@arco-design/mobile-react";
+import { request } from "@umijs/max";
+import { convertLocaleToLangParam } from "./locales/utils";
+import { getSearchParams } from "@/common/jsbridge/jsbridge";
+
+// 初始化国际化模块
+const fetchMultilingualData = initIntl({
+  requestInstance: request,
+  messageInstance: {
+    error: (msg: string) => Toast.error(msg),
+    warning: (msg: string) => Toast.warn(msg),
+  },
+  fetchMultilingualDataParams: {
+    tag: "cs_fe_mobile", // 独立应用使用不同的 tag
+    lang: convertLocaleToLangParam(getSearchParams().language as string),
+    app_name: "middle",
+  },
+  indexedDBParams: {
+    dbName: "mico_cs_mobile_i18n_db",
+  },
+});
+
+export function render(oldRender: () => void): void {
+  fetchMultilingualData()
+    .then(oldRender)
+    .catch((error: Error) => {
+      console.error("获取多语言文案失败", error);
+      oldRender();
+    });
+}
+```
+
+**独立应用的文案文件（apps/mico-cs-mobile/src/locales/index.ts）**：
+
+```typescript
+import { i18n } from "@portal-web/common-intl";
+
+const intl = {
+  sdk_h5_ticket_record: () =>
+    i18n({
+      key: "sdk_h5_ticket_record",
+      defaultMessage: "工单记录",
+    }),
+  // ... 其他文案
+};
+
+export default intl;
+```
+
+**在组件中使用**：
+
+```typescript
+import intl from "@/locales";
+
+<h1>{intl.sdk_h5_ticket_record()}</h1>;
+```
+
+## 导出 API
+
+`@portal-web/common-intl` 提供以下导出：
+
+| 导出                 | 类型 | 说明                                                      |
+| -------------------- | ---- | --------------------------------------------------------- |
+| `initIntl`           | 函数 | 初始化国际化模块，返回 `fetchMultilingualData` 函数       |
+| `i18n`               | 函数 | 翻译函数，用于获取单条翻译文案                            |
+| `intl`               | 对象 | PC 端主子应用共享的文案对象（仅供 layout 及其子应用使用） |
+| `LANG`               | 常量 | 支持的语言常量：`ZH_CN`、`EN`、`AR`、`TR`                 |
+| `LOCALE`             | 常量 | `LANG` 的别名，用于兼容                                   |
+| `SUPPORTED_LOCALES`  | 常量 | 支持的语言列表数组                                        |
+| `getCurrentLocale`   | 函数 | 获取当前语言环境（按优先级：URL > localStorage > 浏览器） |
+| `setLocaleToStorage` | 函数 | 设置语言到 localStorage                                   |
+| `ILang`              | 类型 | 语言类型定义                                              |
+| `TLocale`            | 类型 | `ILang` 的别名，用于兼容                                  |
+
+### 导入示例
+
+```typescript
+// 微前端子应用 - 直接使用共享的 intl 对象
+import { intl } from "@portal-web/common-intl";
+intl.cs_web_common_request_failed();
+
+// 独立应用 - 使用 i18n 函数构建自己的文案对象
+import { i18n, initIntl, LANG } from "@portal-web/common-intl";
+
+// 获取当前语言环境
+import { getCurrentLocale } from "@portal-web/common-intl";
+const currentLang = getCurrentLocale(); // 'zh_CN' | 'en' | 'ar' | 'tr'
+
+// 获取支持的语言列表
+import { SUPPORTED_LOCALES } from "@portal-web/common-intl";
+console.log(SUPPORTED_LOCALES); // ['zh_CN', 'en', 'ar', 'tr']
+```
+
+## 文案管理规则
+
+### PC 端主子应用
+
+- **文案位置**：[packages/common-intl/src/intl.ts](../packages/common-intl/src/intl.ts)
+- **使用方式**：`import { intl } from '@portal-web/common-intl'`
+- **适用应用**：
+  - apps/layout（主应用）
+  - apps/conversation-v2（工作台子应用）
+  - apps/session（服务记录子应用）
+  - apps/workorder（工单子应用）
+  - apps/faq（FAQ 子应用）
+  - apps/permission（权限管理子应用）
+  - packages/shared（公共包）
+
+### 独立应用（如 mico-cs-mobile）
+
+- **文案位置**：各应用自己的 `src/locales/index.ts`
+- **使用方式**：`import intl from '@/locales'`
+- **原因**：独立应用有自己的多语言标签（tag），文案独立管理
+
+### layout-crm 应用
+
+- **角色**：另一个主应用（类似 layout）
+- **使用方式**：使用 `getCurrentLocale`、`LOCALE` 等工具函数
+- **说明**：layout-crm 是独立的布局应用，可按需配置国际化初始化
+
+## 快速接入
+
+### 1. 添加依赖
+
+```json
+// apps/your-app/package.json
+{
+  "dependencies": {
+    "@portal-web/common-intl": "workspace:*"
+  }
+}
+```
+
+### 2. 根据模式选择接入方式
+
+**如果是 layout 的子应用**：
+
+- 无需调用 `initIntl()`
+- 直接使用 `import { intl } from '@portal-web/common-intl'`
+
+**如果是独立应用**：
+
+- 在 `app.ts` 中调用 `initIntl()` 并配置
+- 创建自己的国际化文案集中管理文件，如 `src/locales/index.ts`
+- 使用 `import intl from '@/locales'`
+
+## 语言优先级
+
+`getCurrentLocale()` 函数按以下优先级确定当前语言：
+
+1. **URL 参数**：`?lang=zh_CN`
+2. **localStorage**：`umi_locale` 键
+3. **浏览器默认语言**：`navigator.language`
+
+## 详细文档
+
+完整的 API 参考、类型定义和占位符规则，请参阅：
+
+- **[packages/common-intl/README.md](../packages/common-intl/README.md)**
+
+## 常见问题
+
+### Q: 微前端子应用需要调用 initIntl 吗？
+
+不需要。主应用（layout）负责初始化和获取文案，子应用直接使用共享的 `intl` 对象即可。
+
+### Q: 如何获取多语言中台的 `tag` 和 `app_name`？
+
+请联系多语言中台管理员，根据你的应用申请对应的配置参数。
+
+### Q: 翻译数据什么时候加载？
+
+推荐在 UmiJS 的 `render` 钩子中调用 `fetchMultilingualData()`，确保在应用渲染前完成加载。
+
+### Q: 如何添加新的翻译文案？
+
+1. 在多语言中台添加新的翻译 key 和对应的各语言翻译
+2. PC 端：在 `packages/common-intl/src/intl.ts` 中添加对应的函数
+3. 独立应用：在应用自己的 `src/locales/index.ts` 中添加
+4. 在代码中通过 `intl.xxx()` 调用
+
+### Q: IndexedDB 不可用怎么办？
+
+库会自动降级到内存缓存模式，不影响正常使用，但页面刷新后需要重新拉取数据。
+
+### Q: 主应用获取文案失败，子应用会怎样？
+
+会显示兜底文案（`defaultMessage`）。建议在定义文案时始终提供有意义的兜底文案。
+
+### Q: 如何切换语言？
+
+语言切换由主应用（layout）的 AvatarDropdown 组件处理，切换后会刷新页面重新加载对应语言的文案。
+
+### Q: 支持哪些语言？
+
+目前支持以下语言：
+
+| 语言常量     | 值      | 说明     |
+| ------------ | ------- | -------- |
+| `LANG.ZH_CN` | `zh_CN` | 简体中文 |
+| `LANG.EN`    | `en`    | 英语     |
+| `LANG.AR`    | `ar`    | 阿拉伯语 |
+| `LANG.TR`    | `tr`    | 土耳其语 |
+
+### Q: 如何在代码中获取当前语言？
+
+```typescript
+import { getCurrentLocale } from "@portal-web/common-intl";
+
+const currentLang = getCurrentLocale();
+if (currentLang === "ar") {
+  // 处理阿拉伯语的 RTL 布局
+}
+```
+
+### Q: 模块级常量中使用 intl 时，为什么文案显示不正确？
+
+当在模块顶层定义常量时，`intl.xxx()` 会在模块加载时立即执行，此时多语言文案可能还未加载完成，导致显示兜底文案或空值。
+
+**错误示例**：
+
+```typescript
+// ❌ 模块加载时立即执行，此时文案可能未加载
+export const STATUS_TEXT = {
+  pending: intl.cs_web_status_pending(),
+  completed: intl.cs_web_status_completed(),
+};
+```
+
+**正确做法**：用函数包裹，延迟到运行时获取文案。
+
+```typescript
+// ✅ 函数形式，运行时调用才获取文案
+export const getStatusText = (status: TStatus): string => {
+  const map: Record<TStatus, string> = {
+    pending: intl.cs_web_status_pending(),
+    completed: intl.cs_web_status_completed(),
+  };
+  return map[status];
+};
+```
+
+**在组件中使用时**，如果需要构建选项列表，可用 `useMemo`：
+
+```tsx
+const options = useMemo(
+  () =>
+    Object.values(Status).map((status) => ({
+      value: status,
+      label: getStatusText(status),
+    })),
+  [],
+);
+```

package/generators/micro-react/templates/apps/layout/docs/feature-404/351/241/265/351/235/242.md

@@ -11,7 +11,7 @@
 ### 技术栈
 
 - 框架：React 18 + @umijs/max
-- UI 组件：Arco Design `Result`、`Button`、`Space`
+- UI 组件：@mico-platform/ui `Result`、`Button`、`Space`
 - 路由：React Router 6 通配符路由
 
 ### 核心实现
@@ -84,7 +84,7 @@ const getFirstAvailablePath = (filterOptions: MenuFilterOptions): string;
 
 | 决策点 | 选择 | 理由 |
 | --- | --- | --- |
-| UI 组件 | Arco Design Result | 与 403 页面保持一致，复用现有组件库 |
+| UI 组件 | @mico-platform/ui Result | 与 403 页面保持一致，复用现有组件库 |
 | 首页跳转逻辑 | 动态获取第一个可访问路由 | 适应动态菜单配置，不硬编码路径 |
 | 权限过滤 | 复用 filterMenuItems | 与菜单权限逻辑保持一致 |
 

package/generators/micro-react/templates/apps/layout/docs/feature-/344/270/273/351/242/230/350/211/262/345/210/207/346/215/242.md

@@ -11,7 +11,7 @@ Layout 应用支持亮色/暗黑主题切换，通过 CSS 变量实现运行时
 ### 技术栈
 
 - 框架：React 18 + UmiJS 4
-- UI 组件：Arco Design
+- UI 组件：@mico-platform/ui
 - 样式：Less + CSS Variables
 - 状态管理：React Hooks + localStorage
 
@@ -19,7 +19,7 @@ Layout 应用支持亮色/暗黑主题切换，通过 CSS 变量实现运行时
 
 采用双属性主题系统：
 
-1. `arco-theme` 属性控制 Arco Design 组件主题
+1. `arco-theme` 属性控制 @mico-platform/ui 组件主题（基于 Arco）
 2. `data-theme` 属性控制自定义 CSS 变量
 
 两个属性都设置在 `body` 元素上，确保选择器正确匹配。Less 变量引用 CSS 变量，实现编译时类型安全和运行时动态切换。
@@ -28,22 +28,19 @@ Layout 应用支持亮色/暗黑主题切换，通过 CSS 变量实现运行时
 
 ### 主题系统核心文件
 
-主题变量统一定义在 `packages/shared-styles/` 共享包中：
+主题变量由 `@mico-platform/theme` 包提供，主应用与子应用通过该包获取 CSS 变量与 Less 变量：
 
-| 文件路径                                              | 说明                           |
-| ----------------------------------------------------- | ------------------------------ |
-| `packages/shared-styles/themes/normal/custom-var.less` | 亮色主题 CSS 变量定义          |
-| `packages/shared-styles/themes/dark/custom-var.less`   | 暗黑主题 CSS 变量定义          |
-| `packages/shared-styles/arco-override.less`            | Arco Design 变量覆盖映射       |
-| `packages/shared-styles/variables.less`                | Less 变量定义（引用 CSS 变量） |
-| `packages/shared-styles/index.less`                    | 入口文件，导入全部（主应用用） |
-| `packages/shared-styles/variables-only.less`           | 仅 Less 变量（子应用用）       |
+| 入口/子路径                    | 说明                           |
+| ------------------------------ | ------------------------------ |
+| `@mico-platform/theme`         | 主入口，CSS 变量 + Less 变量   |
+| `@mico-platform/theme/variables` | 仅 Less 变量（子应用用） |
+| `@mico-platform/theme/theme-inject`   | 子应用独立运行时注入主题 |
 
 ### Layout 应用文件
 
 | 文件路径                     | 说明                                      |
 | ---------------------------- | ----------------------------------------- |
-| `src/global.less`            | 导入 `<%= packageScope %>/shared-styles` 共享包 |
+| `src/global.less`            | 导入 `@mico-platform/theme`               |
 | `src/common/theme.ts`        | 主题切换逻辑（`applyTheme`、`initTheme`） |
 | `src/hooks/useTheme.ts`      | 主题管理 Hook                             |
 
@@ -82,7 +79,7 @@ const { theme, isDark, toggleTheme, setTheme } = useTheme();
 
 ### 主要颜色变量
 
-> 完整变量列表请参考 [shared-styles 包文档](../../../packages/shared-styles/README.md#主要变量)
+> 完整变量列表请参考 @mico-platform/theme 包文档
 
 | 分类   | 变量                                    |
 | ------ | --------------------------------------- |
@@ -151,8 +148,8 @@ export const THEME = {
 
 ```less
 // apps/[子应用]/src/global.less
-@import '<%= packageScope %>/shared-styles/variables-only';
-// 不要使用 @import '<%= packageScope %>/shared-styles'（会包含 CSS 变量定义）
+@import '@mico-platform/theme/variables';
+// 主应用已注入 CSS 变量时，子应用仅需 Less 变量
 ```
 
 #### 2. app.tsx - 开发环境条件注入
@@ -195,24 +192,24 @@ wc -c apps/[子应用]/dist/umi.css
 # 期望：< 500 字节
 ```
 
-### Arco Design 组件主题适配
+### @mico-platform/ui 组件主题适配
 
-子应用使用 Arco Design 组件时，组件样式会自动跟随主应用的主题切换。
+子应用使用 @mico-platform/ui 组件时，组件样式会自动跟随主应用的主题切换。
 
 #### 原理
 
-1. 主应用加载 Arco Design 并暴露到 `window.arco`
-2. 主应用的 `arco.css` 包含 `arco-theme` 属性选择器
+1. 主应用加载 @mico-platform/ui 并暴露到 `window.micoUi`
+2. 主应用的样式包含 `arco-theme` 属性选择器（基于 Arco）
 3. 主应用切换主题时设置 `body[arco-theme="dark"]`
-4. 子应用的 Arco 组件（来自 window.arco）自动应用暗色样式
+4. 子应用的 UI 组件（来自 window.micoUi）自动应用暗色样式
 
-#### 子应用使用 Arco Design
+#### 子应用使用 @mico-platform/ui
 
 > 详细配置请参考 [微前端模式 - 依赖共享机制](./feature-微前端模式.md#依赖共享机制)
 
 ```tsx
-// 子应用可以直接使用 Arco Design 组件
-import { Button, Card, Message, Tag } from '@arco-design/web-react';
+// 子应用可以直接使用 @mico-platform/ui 组件
+import { Button, Card, Message, Tag } from '@mico-platform/ui';
 
 export default function Page() {
   return (
@@ -224,11 +221,10 @@ export default function Page() {
 }
 ```
 
-**注意**：子应用需要配置 `externals` 将 Arco Design 排除打包，详见 [微前端模式文档](./feature-微前端模式.md#依赖共享机制)。
+**注意**：子应用需要配置 `externals` 将 @mico-platform/ui 排除打包，详见 [微前端模式文档](./feature-微前端模式.md#依赖共享机制)。
 
 ## 相关文档
 
 - [微前端模式](./feature-微前端模式.md) - qiankun 微前端架构与依赖共享
 - [日志与常量](./arch-日志与常量.md) - Logger 工具与常量管理（含 THEME 常量）
-- [shared-styles 包](../../../packages/shared-styles/README.md) - 共享样式包使用指南
 - [提交规范](../../../docs/commit-message.md) - Git Commit 规范

package/generators/micro-react/templates/apps/layout/docs/feature-/345/276/256/345/211/215/347/253/257/346/250/241/345/274/217.md

@@ -13,7 +13,7 @@
 
 - 框架：React 18 + @umijs/max
 - 微前端：qiankun (通过 @umijs/max 内置插件)
-- UI 组件：Arco Design
+- UI 组件：@mico-platform/ui
 - 路由：React Router 6
 
 ### 核心实现
@@ -256,9 +256,9 @@ export const getRequest = () => mainAppProps?.request;
 
 ### 问题背景
 
-如果子应用直接安装 React、Arco Design 等大型库，会导致：
+如果子应用直接安装 React、@mico-platform/ui 等大型库，会导致：
 
-1. **包体积重复**：React (~140KB) + Arco Design (~800KB) 被打包多次
+1. **包体积重复**：React (~140KB) + UI 库 (~800KB) 被打包多次
 2. **样式冲突**：多份 CSS 可能互相覆盖
 3. **React 实例问题**：可能出现 "Invalid hook call" 错误
 
@@ -270,8 +270,8 @@ export const getRequest = () => mainAppProps?.request;
 ┌─────────────────────────────────────────────────────────────┐
 │  主应用 (layout)                                            │
 │  ┌─────────────────────────────────────────────────────────┐│
-│  │ 1. 打包并加载 React、ReactDOM、Arco Design              ││
-│  │ 2. 暴露到 window.React / window.ReactDOM / window.arco  ││
+│  │ 1. 打包并加载 React、ReactDOM、@mico-platform/ui        ││
+│  │ 2. 暴露到 window.React / window.ReactDOM / window.micoUi ││
 │  └─────────────────────────────────────────────────────────┘│
 │                           ↓ 共享                            │
 │  ┌─────────────────────────────────────────────────────────┐│
@@ -289,7 +289,7 @@ export const getRequest = () => mainAppProps?.request;
 
 ```typescript
 // apps/layout/src/app.tsx
-import * as arco from '@arco-design/web-react';
+import * as micoUi from '@mico-platform/ui';
 import React from 'react';
 import ReactDOM from 'react-dom';
 
@@ -297,7 +297,7 @@ import ReactDOM from 'react-dom';
 if (typeof window !== 'undefined') {
   (window as any).React = React;
   (window as any).ReactDOM = ReactDOM;
-  (window as any).arco = arco;
+  (window as any).micoUi = micoUi;
 }
 ```
 
@@ -334,7 +334,7 @@ const config: ReturnType<typeof defineConfig> = {
   externals: {
     react: 'window.React',
     'react-dom': 'window.ReactDOM',
-    '@arco-design/web-react': 'window.arco',
+    '@mico-platform/ui': 'window.micoUi',
   },
 };
 
@@ -362,23 +362,23 @@ export default defineConfig(config);
 
 #### 3. package.json - 开发依赖
 
-将 Arco Design 放在 `devDependencies`（用于类型提示和开发），生产环境从主应用获取：
+将 @mico-platform/ui 放在 `devDependencies`（用于类型提示和开发），生产环境从主应用获取。版本由生成器在创建子应用时从 npm 解析为当时最新版本（不使用 `latest` 标签）：
 
 ```json
 {
   "devDependencies": {
-    "@arco-design/web-react": "^2.66.6"
+    "@mico-platform/ui": "^x.x.x"
   }
 }
 ```
 
-### 子应用使用 Arco Design
+### 子应用使用 @mico-platform/ui
 
-配置完成后，子应用可以正常导入和使用 Arco Design 组件：
+配置完成后，子应用可以正常导入和使用 UI 组件：
 
 ```tsx
 // apps/[子应用]/src/pages/index.tsx
-import { Button, Card, Message, Tag } from '@arco-design/web-react';
+import { Button, Card, Message, Tag } from '@mico-platform/ui';
 
 export default function HomePage() {
   return (
@@ -396,7 +396,7 @@ export default function HomePage() {
 
 | 配置方式           | 子应用 JS 体积 | 说明                     |
 | ------------------ | -------------- | ------------------------ |
-| 直接安装依赖       | ~1.2MB         | 包含 React + Arco Design |
+| 直接安装依赖       | ~1.2MB         | 包含 React + @mico-platform/ui |
 | **externals 共享** | **~50KB**      | 仅业务代码               |
 
 ### 运行环境说明
@@ -417,14 +417,13 @@ export default function HomePage() {
 - 组件会在 `entry` 或 `name` 变化时重新加载微应用
 - 加载失败会显示错误信息，便于调试
 - **子应用应使用主应用传递的 `request` 实例**，确保认证 token 和拦截器一致
-- **子应用使用 externals 共享依赖**，避免重复打包 React 和 Arco Design
+- **子应用使用 externals 共享依赖**，避免重复打包 React 和 @mico-platform/ui
 
 ## 相关文档
 
 - [主题色切换](./feature-主题色切换.md) - 主题系统实现与子应用适配
 - [请求模块架构](./arch-请求模块.md) - HTTP 请求层模块化设计
 - [日志与常量](./arch-日志与常量.md) - Logger 工具与常量管理
-- [shared-styles 包](../../../packages/shared-styles/README.md) - 共享样式包使用指南
 - [提交规范](../../../docs/commit-message.md) - Git Commit 规范
 
 ## 加载类型判断逻辑

package/generators/micro-react/templates/apps/layout/docs/feature-/350/217/234/345/215/225/346/235/203/351/231/220/346/216/247/345/210/266.md

@@ -31,7 +31,7 @@
 ### 技术栈
 
 - 框架：React 18 + @umijs/max
-- UI 组件：Arco Design (Result 组件)
+- UI 组件：@mico-platform/ui (Result 组件)
 - 状态管理：Umi initialState
 
 ### 权限控制流程