SuperAPI AI 工具集

cometchat-react-react-router

前端与建站

查看项目

更新于 10-16 05:03

技能介绍

用途:在 React Router 项目(v6 或 v7,library 或 framework 模式)中集成 CometChat React UI Kit v6。不适用于 Next.js、普通 React.js(无 React Router)或 Astro 项目,应改用对应框架技能。

主要能力:以 @cometchat/skills-cli 做确定性的脚手架与校验,并提供三种体验:多会话(会话列表+当前会话)、单会话(两个已知用户或群组的聊天窗)、完整信使(Chats/Calls/Users/Groups 标签栏)。CLI 模板已覆盖初始化、登录、渲染、生产鉴权、用户管理、主题、悬浮挂件与组件替换;超出部分需查询 CometChat 文档 MCP(cometchat-docs)获取组件属性、回调、请求构建器、SDK 事件、CSS 变量等,不得凭记忆编造 SDK 代码。

使用方式:先运行 npx @cometchat/skills-cli@latest detect --json 确认框架为 react-router;再确定体验编号(1/2/3),随后依次执行 view、apply(--placement dedicated-route)与 verify。若文档 MCP 未安装,需要非 CLI 事实时应提示安装:claude mcp add --transport http cometchat-docs https://www.cometchat.com/docs/mcp。apply 后由 npx @cometchat/skills-cli@latest install 自动识别包管理器安装依赖;CLI 会在 .env 中生成 APP_ID、REGION、AUTH_KEY 占位值并加入 .gitignore。v7 框架模式由 CLI 自动改写 app/routes.ts;v6 库模式需手动在现有 <Routes> 中添加 <Route path="/chat" element={<CometChatRoute />} />。

适用场景与限制:默认以测试用户 cometchat-uid-1 登录,可直接观察 /chat 效果。初始化阶段只允许 CLI 写文件,不得手改;后续定制搜索、详情、线程、自定义气泡等需先查 Phase B 查找表,优先使用内置组件(如 CometChatSearch、CometChatUserDetails、CometChatGroupMembers、CometChatThreadHeader),不得自造搜索 UI。失败命令不自动重试,冲突需用户明确确认后才可用 --force。具体收费与价格暂未提供。