组件介绍
Vibe Coding 快速接入
不想手动翻阅文档?你可以通过 AIDev Skill 市场获取 ai-blueking-guide Skill,在 AI IDE 中用自然语言描述需求,让 AI 帮你生成集成代码。详见 Skill 指引。
什么是 AI 小鲸 v2.0
AI 小鲸 v2.0 是蓝鲸智云推出的新一代智能对话前端解决方案。它采用三层模块化架构,将 UI 渲染、业务逻辑和状态管理彻底分离,为开发者提供灵活、可扩展的智能对话集成能力。
无论你是需要快速嵌入一个聊天窗口,还是构建高度定制化的 AI 交互界面,AI 小鲸 v2.0 都能满足你的需求。它同时支持 Vue 2 和 Vue 3,并提供完整的 TypeScript 类型定义。
核心流程
- 在 AIDev 平台配置 Agent(LLM、知识库、工具、快捷指令等)
- 发布后获取 URL
- 将 URL 传给
AIBlueking或ChatBot→ 开箱即用
架构总览

AI 小鲸 v2.0 由三层组成:业务组件层负责组装和编排,纯 UI 组件库专注渲染,业务 SDK 处理数据流与状态。三者可独立使用,也可组合集成。
三个核心包
| 包名 | 定位 | 说明 |
|---|---|---|
@blueking/ai-blueking | 业务组件层 | 组装 UI + SDK + 管理器,提供 ChatBot 和 AIBlueking 等开箱即用的高级组件 |
@blueking/chat-x | 纯 UI 组件 | 不含任何业务逻辑,提供 ChatInput、MessageContainer、ShortcutRender、AiSelection 等原子级 UI 组件 |
@blueking/chat-helper | 状态管理 + API 调用 + 流式处理 | 提供 useChatHelper()、AGUIProtocol 流式协议以及 agent / session / message 等业务模块 |
集成模式
根据业务场景,你可以选择不同的集成方式:
| 模式 | 组件 / 入口 | 适用场景 | 复杂度 |
|---|---|---|---|
| 浮窗模式 | AIBlueking | SaaS 全局 AI 助手,右下角浮窗 | ⭐ (仅需 url) |
| 页面嵌入 | ChatBot | 聊天作为页面主内容,嵌入 DOM | ⭐ (仅需 url) |
| Standalone | @blueking/ai-blueking/standalone | 非 Vue 宿主(React、纯 HTML 等),mountAIBlueking | ⭐⭐ |
| 原子组件 | chat-x + chat-helper | 深度定制 | ⭐⭐⭐ |
- AIBlueking 浮窗模式:全局 AI 助手入口,提供右下角浮球、可拖拽面板、划词弹窗和内置会话管理,适合 SaaS 产品全局集成。仅需传入
url即可开箱即用。 - ChatBot 页面嵌入模式:将聊天窗口嵌入到页面的指定区域(如侧边栏、主内容区),适合聊天作为核心功能的场景。同样仅需传入
url。 - Standalone 非 Vue 宿主(v2.1.4-beta.8+):宿主无 Vue 时,通过
mountAIBlueking/mountChatBot挂载,bundle 内已含 Vue 3 runtime。详见 Standalone 集成。 - 原子组件模式:直接使用
chat-x的 UI 组件和chat-helper的业务 SDK,自由组装,适合需要深度定制交互的场景。
核心特性
- AG-UI 流式响应 — 基于
AGUIProtocol实现实时流式输出,支持打字机效果与中断控制 - 会话生命周期管理 — 完整的会话创建、切换、删除、重命名,支持多会话并行
- 快捷指令 — 内置快捷指令(Shortcut)体系(由 AIDev 后台配置,自动加载)
- 引用与溯源 — 支持消息引用、来源标注,增强内容可信度
- 分享能力 — 支持会话分享与快照导出
- 拖拽交互 — AIBlueking 面板支持自由拖拽与尺寸调整
v2.0 的变化
AI 小鲸 v2.0 是一次架构级重构,主要变化包括:
- 模块化架构 — 从单体组件拆分为三层架构,关注点彻底分离
- Manager 模式 — 引入
SessionManager、ChatManager、ShortcutManager等业务管理器,易于扩展和覆写 - 独立包设计 —
chat-x和chat-helper可完全独立使用,不依赖上层组件 - TypeScript 优先 — 全量 TypeScript 重写,提供完整的类型定义和类型推导
- AG-UI 协议 — 全新的流式通信协议,替代旧版 SSE 方案,支持更丰富的事件类型
从 v1.x 升级?
请参阅 v1.x 迁移指南 了解详细的升级步骤与 Breaking Changes。