====== NOP Chaos Next：AMIS 前端应用框架 ======

NOP Chaos Next 是 Nop 平台的 AMIS 前端应用框架，项目地址 [[https://github.com/entropy-cloud/nop-chaos-next|nop-chaos-next]]。它定位为**企业级应用脚手架**，提供扩展系统和插件化能力，团队通过声明式配置即可构建复杂业务应用。

Next 基于 AMIS 渲染（已迁移到 React 19），同时逐步引入 Flux 作为可选渲染层。

===== 与 Flux 的分工 =====

Nop 前端有两个并行的项目：

^ 维度 ^ Chaos Flux ^ Chaos Next ^
| 定位 | 低代码运行时和渲染框架 | 前端应用框架和脚手架 |
| 核心能力 | 七个原语构建的 runtime | Extension 系统 + Plugin 系统 |
| 渲染层 | 自研 renderer 架构 | 基于 AMIS（React 19 迁移版） |
| 使用者 | 平台团队构建低代码基础设施 | 业务团队构建企业级应用 |

**Flux** = 如何从 JSON 生成 UI（底层 runtime）
**Next** = 如何构建可扩展的业务应用（应用框架）

Next 当前从 Flux 同步 ui、theme-tokens、tailwind-preset 三个包，后续将引入 Flux 渲染引擎作为可选的页面渲染层。

===== Extension 系统 =====

Extension 是宿主应用的扩展机制，在启动时加载一次，用于配置和资源注入。一个 Extension 可以提供：

  * **品牌配置** — 名称、logo、标题
  * **主题和样式** — 运行时主题切换
  * **语言资源** — i18n 翻译
  * **菜单扩展** — 动态注册菜单项
  * **页面注册** — 内置页面添加
  * **插件清单** — 声明可用的插件
  * **认证配置** — 登录方式

Extension 在应用初始化阶段加载，不涉及运行时动态加载，适合静态配置场景。

===== Plugin 系统 =====

Plugin 是页面级扩展，通过 SystemJS 远程加载，支持运行时动态加载和卸载：

  * 独立的页面渲染逻辑
  * 独立的构建和部署
  * 运行时动态加载和卸载
  * 与宿主的隔离通信机制

Plugin 适合以下场景：

  * 第三方开发者提供独立业务页面
  * 多租户环境下按需加载功能
  * 大型应用中按权限动态加载模块

Plugin 通过预定义的通信桥（plugin-bridge）与宿主交互，保证隔离性。

===== 内置页面模板 =====

Next 提供了完整的业务页面模板，可以直接使用或作为参考：

^ 页面 ^ 说明 ^
| Dashboard | 数据概览和统计卡片 |
| AI Workbench | AI 辅助工作台 |
| Flow Editor | 流程编辑器 |
| Master-Detail | 主子表 CRUD |
| List + Form | 列表和表单组合 |

===== 项目结构 =====

<code>
nop-chaos-next/
  apps/main/                   ← 主应用（宿主）
  packages/
    core/                      ← 核心工具和类型
    shared/                    ← 共享类型定义
    amis-core/                 ← AMIS 宿主桥接层
    amis-react/                ← AMIS React 集成
    plugin-bridge/             ← 插件通信桥
    theme-tokens/              ← 主题 token
    tailwind-preset/           ← Tailwind 预设
    ui/                        ← 共享 UI 组件
  flux-lib/ui/                 ← 来自 Flux 的 UI 包
  examples/
    plugin-demo/               ← 插件开发示例
    extension-demo/            ← Extension 示例
  docs/                        ← 文档
</code>

===== 核心架构 =====

应用启动时，Next 的工作流：

  1. 加载 Extension（继承基础配置）
  2. 初始化主题和国际化
  3. 注册菜单和页面路由
  4. 按需加载 AMIS 或 Flux 渲染引擎
  5. 动态加载 Plugin（SystemJS）
  6. 渲染应用界面

其中第 3-5 步均可通过 Delta 定制覆盖——菜单、页面、插件都可以从后端 Delta 层自动合并配置。

===== 快速体验 =====

<code bash>
git clone https://github.com/entropy-cloud/nop-chaos-next.git
cd nop-chaos-next
pnpm install
pnpm dev
</code>

访问 http://localhost:5173 查看主应用。examples 目录下包含插件和 Extension 的示例代码。

===== 进一步阅读 =====

  * [[.:flux_guide|NOP Chaos Flux 运行时]]
  * [[.:frontend_guide|Nop 平台前端架构]]
  * [[https://github.com/entropy-cloud/nop-chaos-next/tree/master/docs|Next 文档索引]]