跳到主要内容

工作台、Widget 与平台组件库

选择复用层级

任务使用能力
为用户组织首页、看板和快捷入口用户仪表盘 + 仪表盘模板
定义可配置的局部栏目Widget
向多个应用分发渲染器、表单项、动作或编辑器插件平台组件库
构建独立路由、独立工程或复杂子系统微前端

Widget 负责页面中的一块内容;仪表盘负责布局;平台组件库负责跨应用安装和版本治理。不要把这三类对象混成一个发布包。

创建 Widget

  1. 打开 门户栏目管理,新建栏目。
  2. 填写名称、显示名、描述和分类。
  3. 选择生成器并填写生成器参数。
  4. 配置是否显示头部、配置对话框大小、最小尺寸、最大尺寸和默认尺寸。
  5. 设置默认样式并保存。
  6. 在仪表盘中添加该 Widget,打开配置对话框并保存一组有效配置。

成功标志:Widget 能被仪表盘选择,配置表单可打开,内容在最小、默认和最大尺寸下均可正常显示。

配置仪表盘模板

适用于为一类用户提供统一的初始工作台。

  1. 新建仪表盘模板,填写名称和描述。
  2. 需要作为初始布局时设为默认模板。
  3. 打开 Dashboard 编辑器,添加 Widget 并调整位置和尺寸。
  4. 保存模板,使用测试账号首次进入用户仪表盘。
  5. 点击 开始编辑,选择模板并保存个人布局。
  6. 重新登录,确认个人布局被保留。

成功标志:新用户获得预期模板;用户可以保存自己的布局;个人修改不改变模板本身和其他用户的布局。

制作并安装平台组件库

准备安装包

  1. 构建组件库 ZIP。
  2. 在 ZIP 中包含 components.manifest.json
  3. 在清单中声明组件、版本和 publicPath
  4. 确认版本高于平台中已安装版本,publicPath 不与其他组件库冲突。
  5. 保留可用于回退的上一版 ZIP 和清单。

安装到平台

  1. 打开平台组件库管理页面并上传 ZIP。
  2. 检查清单校验、组件冲突和公共路径检查结果。
  3. 完成安装,确认新版本出现在组件库列表。
  4. 选择一个测试应用,执行 导入组件库
  5. 在页面设计器中创建测试页面,确认新组件可选且能渲染。

成功标志:平台只保留符合版本规则的安装记录;应用导入后可使用组件;未导入的应用不受影响。

升级、移除和卸载

  1. 升级前先在测试应用导入新版本并完成页面回归。
  2. 从应用移除组件库前,删除或替换页面中的组件引用。
  3. 从平台卸载组件库前,确认没有应用继续引用。
  4. 卸载被拒绝时,按引用信息逐个清理应用,不要直接删除平台记录或文件。

平台不允许卸载仍被应用引用的组件库。

何时改用微前端

出现以下任一条件时使用 微前端

  • 页面属于独立子系统并需要独立路由。
  • 交互模型无法由 UI Schema、Widget 和平台组件表达。
  • 必须使用独立前端工程、构建链或运行时控制。

通用渲染能力仍应留在平台组件库,只有独立业务页面进入微前端,避免多个子应用重复打包同一组件。