[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"similar-urban-bot--urban-bot":3,"tool-urban-bot--urban-bot":64},[4,17,27,35,43,56],{"id":5,"name":6,"github_repo":7,"description_zh":8,"stars":9,"difficulty_score":10,"last_commit_at":11,"category_tags":12,"status":16},3808,"stable-diffusion-webui","AUTOMATIC1111\u002Fstable-diffusion-webui","stable-diffusion-webui 是一个基于 Gradio 构建的网页版操作界面，旨在让用户能够轻松地在本地运行和使用强大的 Stable Diffusion 图像生成模型。它解决了原始模型依赖命令行、操作门槛高且功能分散的痛点，将复杂的 AI 绘图流程整合进一个直观易用的图形化平台。\n\n无论是希望快速上手的普通创作者、需要精细控制画面细节的设计师，还是想要深入探索模型潜力的开发者与研究人员，都能从中获益。其核心亮点在于极高的功能丰富度：不仅支持文生图、图生图、局部重绘（Inpainting）和外绘（Outpainting）等基础模式，还独创了注意力机制调整、提示词矩阵、负向提示词以及“高清修复”等高级功能。此外，它内置了 GFPGAN 和 CodeFormer 等人脸修复工具，支持多种神经网络放大算法，并允许用户通过插件系统无限扩展能力。即使是显存有限的设备，stable-diffusion-webui 也提供了相应的优化选项，让高质量的 AI 艺术创作变得触手可及。",162132,3,"2026-04-05T11:01:52",[13,14,15],"开发框架","图像","Agent","ready",{"id":18,"name":19,"github_repo":20,"description_zh":21,"stars":22,"difficulty_score":23,"last_commit_at":24,"category_tags":25,"status":16},1381,"everything-claude-code","affaan-m\u002Feverything-claude-code","everything-claude-code 是一套专为 AI 编程助手（如 Claude Code、Codex、Cursor 等）打造的高性能优化系统。它不仅仅是一组配置文件，而是一个经过长期实战打磨的完整框架，旨在解决 AI 代理在实际开发中面临的效率低下、记忆丢失、安全隐患及缺乏持续学习能力等核心痛点。\n\n通过引入技能模块化、直觉增强、记忆持久化机制以及内置的安全扫描功能，everything-claude-code 能显著提升 AI 在复杂任务中的表现，帮助开发者构建更稳定、更智能的生产级 AI 代理。其独特的“研究优先”开发理念和针对 Token 消耗的优化策略，使得模型响应更快、成本更低，同时有效防御潜在的攻击向量。\n\n这套工具特别适合软件开发者、AI 研究人员以及希望深度定制 AI 工作流的技术团队使用。无论您是在构建大型代码库，还是需要 AI 协助进行安全审计与自动化测试，everything-claude-code 都能提供强大的底层支持。作为一个曾荣获 Anthropic 黑客大奖的开源项目，它融合了多语言支持与丰富的实战钩子（hooks），让 AI 真正成长为懂上",138956,2,"2026-04-05T11:33:21",[13,15,26],"语言模型",{"id":28,"name":29,"github_repo":30,"description_zh":31,"stars":32,"difficulty_score":23,"last_commit_at":33,"category_tags":34,"status":16},2271,"ComfyUI","Comfy-Org\u002FComfyUI","ComfyUI 是一款功能强大且高度模块化的视觉 AI 引擎，专为设计和执行复杂的 Stable Diffusion 图像生成流程而打造。它摒弃了传统的代码编写模式，采用直观的节点式流程图界面，让用户通过连接不同的功能模块即可构建个性化的生成管线。\n\n这一设计巧妙解决了高级 AI 绘图工作流配置复杂、灵活性不足的痛点。用户无需具备编程背景，也能自由组合模型、调整参数并实时预览效果，轻松实现从基础文生图到多步骤高清修复等各类复杂任务。ComfyUI 拥有极佳的兼容性，不仅支持 Windows、macOS 和 Linux 全平台，还广泛适配 NVIDIA、AMD、Intel 及苹果 Silicon 等多种硬件架构，并率先支持 SDXL、Flux、SD3 等前沿模型。\n\n无论是希望深入探索算法潜力的研究人员和开发者，还是追求极致创作自由度的设计师与资深 AI 绘画爱好者，ComfyUI 都能提供强大的支持。其独特的模块化架构允许社区不断扩展新功能，使其成为当前最灵活、生态最丰富的开源扩散模型工具之一，帮助用户将创意高效转化为现实。",107662,"2026-04-03T11:11:01",[13,14,15],{"id":36,"name":37,"github_repo":38,"description_zh":39,"stars":40,"difficulty_score":23,"last_commit_at":41,"category_tags":42,"status":16},3704,"NextChat","ChatGPTNextWeb\u002FNextChat","NextChat 是一款轻量且极速的 AI 助手，旨在为用户提供流畅、跨平台的大模型交互体验。它完美解决了用户在多设备间切换时难以保持对话连续性，以及面对众多 AI 模型不知如何统一管理的痛点。无论是日常办公、学习辅助还是创意激发，NextChat 都能让用户随时随地通过网页、iOS、Android、Windows、MacOS 或 Linux 端无缝接入智能服务。\n\n这款工具非常适合普通用户、学生、职场人士以及需要私有化部署的企业团队使用。对于开发者而言，它也提供了便捷的自托管方案，支持一键部署到 Vercel 或 Zeabur 等平台。\n\nNextChat 的核心亮点在于其广泛的模型兼容性，原生支持 Claude、DeepSeek、GPT-4 及 Gemini Pro 等主流大模型，让用户在一个界面即可自由切换不同 AI 能力。此外，它还率先支持 MCP（Model Context Protocol）协议，增强了上下文处理能力。针对企业用户，NextChat 提供专业版解决方案，具备品牌定制、细粒度权限控制、内部知识库整合及安全审计等功能，满足公司对数据隐私和个性化管理的高标准要求。",87618,"2026-04-05T07:20:52",[13,26],{"id":44,"name":45,"github_repo":46,"description_zh":47,"stars":48,"difficulty_score":23,"last_commit_at":49,"category_tags":50,"status":16},2268,"ML-For-Beginners","microsoft\u002FML-For-Beginners","ML-For-Beginners 是由微软推出的一套系统化机器学习入门课程，旨在帮助零基础用户轻松掌握经典机器学习知识。这套课程将学习路径规划为 12 周，包含 26 节精炼课程和 52 道配套测验，内容涵盖从基础概念到实际应用的完整流程，有效解决了初学者面对庞大知识体系时无从下手、缺乏结构化指导的痛点。\n\n无论是希望转型的开发者、需要补充算法背景的研究人员，还是对人工智能充满好奇的普通爱好者，都能从中受益。课程不仅提供了清晰的理论讲解，还强调动手实践，让用户在循序渐进中建立扎实的技能基础。其独特的亮点在于强大的多语言支持，通过自动化机制提供了包括简体中文在内的 50 多种语言版本，极大地降低了全球不同背景用户的学习门槛。此外，项目采用开源协作模式，社区活跃且内容持续更新，确保学习者能获取前沿且准确的技术资讯。如果你正寻找一条清晰、友好且专业的机器学习入门之路，ML-For-Beginners 将是理想的起点。",84991,"2026-04-05T10:45:23",[14,51,52,53,15,54,26,13,55],"数据工具","视频","插件","其他","音频",{"id":57,"name":58,"github_repo":59,"description_zh":60,"stars":61,"difficulty_score":10,"last_commit_at":62,"category_tags":63,"status":16},3128,"ragflow","infiniflow\u002Fragflow","RAGFlow 是一款领先的开源检索增强生成（RAG）引擎，旨在为大语言模型构建更精准、可靠的上下文层。它巧妙地将前沿的 RAG 技术与智能体（Agent）能力相结合，不仅支持从各类文档中高效提取知识，还能让模型基于这些知识进行逻辑推理和任务执行。\n\n在大模型应用中，幻觉问题和知识滞后是常见痛点。RAGFlow 通过深度解析复杂文档结构（如表格、图表及混合排版），显著提升了信息检索的准确度，从而有效减少模型“胡编乱造”的现象，确保回答既有据可依又具备时效性。其内置的智能体机制更进一步，使系统不仅能回答问题，还能自主规划步骤解决复杂问题。\n\n这款工具特别适合开发者、企业技术团队以及 AI 研究人员使用。无论是希望快速搭建私有知识库问答系统，还是致力于探索大模型在垂直领域落地的创新者，都能从中受益。RAGFlow 提供了可视化的工作流编排界面和灵活的 API 接口，既降低了非算法背景用户的上手门槛，也满足了专业开发者对系统深度定制的需求。作为基于 Apache 2.0 协议开源的项目，它正成为连接通用大模型与行业专有知识之间的重要桥梁。",77062,"2026-04-04T04:44:48",[15,14,13,26,54],{"id":65,"github_repo":66,"name":67,"description_en":68,"description_zh":69,"ai_summary_zh":69,"readme_en":70,"readme_zh":71,"quickstart_zh":72,"use_case_zh":73,"hero_image_url":74,"owner_login":67,"owner_name":75,"owner_avatar_url":76,"owner_bio":77,"owner_company":78,"owner_location":78,"owner_email":78,"owner_twitter":78,"owner_website":78,"owner_url":79,"languages":80,"stars":89,"forks":90,"last_commit_at":91,"license":92,"difficulty_score":23,"env_os":93,"env_gpu":94,"env_ram":93,"env_deps":95,"category_tags":104,"github_topics":105,"view_count":23,"oss_zip_url":78,"oss_zip_packed_at":78,"status":16,"created_at":120,"updated_at":121,"faqs":122,"releases":153},3299,"urban-bot\u002Furban-bot","urban-bot","🤖 The universal chatbot library based on React. Write once, launch Telegram, Discord, Facebook, ... every messenger with chatbots","urban-bot 是一个基于 React 构建的通用聊天机器人开发库，旨在让开发者能够“一次编写，多端运行”。它解决了传统机器人开发中需要针对不同即时通讯软件（如 Telegram、Discord、Slack、Facebook Messenger 等）重复适配 API 的痛点。通过 urban-bot，开发者只需使用熟悉的 React 组件语法编写逻辑，即可轻松将同一个机器人部署到多个主流社交平台，未来还将支持 WhatsApp 等平台。\n\n这款工具特别适合熟悉前端技术或希望利用 React 生态进行后端交互开发的程序员使用。其核心亮点在于引入了声明式编程模型，开发者无需深究各平台复杂的底层接口，像编写网页一样组合组件即可构建机器人功能。此外，urban-bot 原生支持 TypeScript，提供完整的类型定义，并具备独立的会话渲染机制，使得每个聊天场景都能拥有独立的状态管理，极大提升了代码的可复用性和维护效率。无论是构建简单的自动回复助手，还是开发带有复杂交互逻辑的多功能机器人，urban-bot 都能提供简洁而强大的技术支持。","![](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002Furban-bot_urban-bot_readme_4dcc22b6f333.jpg)\n\n![Build](https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot\u002Fworkflows\u002FNode.js%20CI\u002Fbadge.svg)\n[![Community Chat](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FCommunity-Chat-blueChat?style=flat-square&logo=telegram)](https:\u002F\u002Ft.me\u002Furbanbotjs)\n\n# Urban Bot\n\nThe universal chatbot library based on [React](https:\u002F\u002Fgithub.com\u002Ffacebook\u002Freact).\n\n* **Declarative.** You don't need to know any messenger API, just write simple react components.\n* **Multiplatform.** Write once, launch any messenger.\n* **Reusable.** Easy share logic between different chatbots or just use common parts.\n* **Session.** App renders unique for every chat, so just write your app as if it is client-side rendering.\n* **Types.** Full typescript support.\n\n**Platforms we are supporting**\n\n[![](files\u002Ftelegram-logo.svg)](https:\u002F\u002Ftelegram.org\u002F)\n [![](files\u002Fdiscord-logo.svg)](https:\u002F\u002Fwww.discord.com\u002F)\n [![](files\u002Fslack-logo.svg)](https:\u002F\u002Fslack.com\u002F)\n [![](files\u002Ffacebook-logo.svg)](https:\u002F\u002Fwww.messenger.com\u002F)\n \n \n**Soon**\n\n[![](files\u002Fwhatsapp-logo.svg)](https:\u002F\u002Fwww.whatsapp.com\u002F)\n [![](files\u002Fvk-logo.svg)](https:\u002F\u002Fwww.vk.com\u002F)\n [![](files\u002Fviber-logo.svg)](https:\u002F\u002Fwww.viber.com\u002F)\n\n## [Get Started](https:\u002F\u002Furban-bot.now.sh\u002Fdocs\u002Fintro.html)\n## [API](https:\u002F\u002Furban-bot.now.sh\u002Fdocs\u002Fcomponents.html)\n## Tutorials\n* [How to create Todo List in Telegram](https:\u002F\u002Fmedium.com\u002F@heresliker\u002Fhow-to-create-todo-list-telegram-bot-with-react-js-f9f77d22cc49)\n* [Как создать Todo List в Telegram](https:\u002F\u002Fmedium.com\u002F@heresliker\u002F%D0%BA%D0%B0%D0%BA-%D1%81%D0%B4%D0%B5%D0%BB%D0%B0%D1%82%D1%8C-todo-list-%D1%87%D0%B0%D1%82-%D0%B1%D0%BE%D1%82%D0%B0-%D0%B2-telegram-%D1%81-%D0%BF%D0%BE%D0%BC%D0%BE%D1%89%D1%8C%D1%8E-react-js-d8a3c238ca91)\n\n## Installation\nPlease use our zero configuration [starter](https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot-starter-typescript).\n#### typescript\n```\nnpx create-urban-bot my-app\n```\n#### javascript\n```\nnpx create-urban-bot my-app --template js\n```\n\nOr install manually:\n```bash\nnpm i react @urban-bot\u002Fcore @urban-bot\u002Ftelegram @urban-bot\u002Ffacebook ...\n```\n\n## Example\n![](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002Furban-bot_urban-bot_readme_40404aecb2fb.gif)\n![](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002Furban-bot_urban-bot_readme_44e715e7fac4.gif)\n```javascript\nimport React from 'react';\nimport { render, Route, Router, Root, Text, ButtonGroup, Button, useText } from '@urban-bot\u002Fcore';\nimport { UrbanBotTelegram } from '@urban-bot\u002Ftelegram';\nimport { UrbanBotSlack } from '@urban-bot\u002Fslack';\n\nfunction Echo() {\n    const [text, setText] = React.useState('Say something');\n\n    useText(({ text }) => {\n        setText(text);\n    });\n\n    return (\n        \u003CText>\n            \u003Ci>{text}\u003C\u002Fi>\n        \u003C\u002FText>\n    );\n}\n\nfunction Counter() {\n    const [count, setCount] = React.useState(0);\n\n    const increment = () => setCount(count + 1);\n    const decrement = () => setCount(count - 1);\n\n    return (\n        \u003CButtonGroup title={count} isNewMessageEveryRender={false}>\n            \u003CButton onClick={increment}>+1\u003C\u002FButton>\n            \u003CButton onClick={decrement}>-1\u003C\u002FButton>\n        \u003C\u002FButtonGroup>\n    );\n}\n\nfunction App() {\n    return (\n        \u003CRouter>\n            \u003CRoute path=\"\u002Fecho\">\n                \u003CEcho \u002F>\n            \u003C\u002FRoute>\n            \u003CRoute path=\"\u002Fcounter\">\n                \u003CCounter \u002F>\n            \u003C\u002FRoute>\n        \u003C\u002FRouter>\n    );\n}\n\nconst urbanBotTelegram = new UrbanBotTelegram({\n    token: 'telegramToken',\n});\n\nconst urbanBotSlack = new UrbanBotSlack({\n    signingSecret: 'slackSigningSecret',\n    token: 'slackToken',\n});\n\nrender(\n    \u003CRoot bot={urbanBotTelegram}>\n        \u003CApp \u002F>\n    \u003C\u002FRoot>\n);\n\nrender(\n    \u003CRoot bot={urbanBotSlack}>\n        \u003CApp \u002F>\n    \u003C\u002FRoot>\n);\n```\n","![](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002Furban-bot_urban-bot_readme_4dcc22b6f333.jpg)\n\n![构建](https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot\u002Fworkflows\u002FNode.js%20CI\u002Fbadge.svg)\n[![社区聊天](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FCommunity-Chat-blueChat?style=flat-square&logo=telegram)](https:\u002F\u002Ft.me\u002Furbanbotjs)\n\n# Urban Bot\n\n基于 [React](https:\u002F\u002Fgithub.com\u002Ffacebook\u002Freact) 的通用聊天机器人库。\n\n* **声明式。** 无需了解任何消息平台的 API，只需编写简单的 React 组件。\n* **跨平台。** 一次编写，即可部署到任意消息平台。\n* **可复用。** 轻松在不同聊天机器人之间共享逻辑，或直接使用公共组件。\n* **会话支持。** 应用程序为每个对话单独渲染，因此你可以像进行客户端渲染一样编写应用。\n* **类型安全。** 完全支持 TypeScript。\n\n**我们支持的平台**\n\n[![](files\u002Ftelegram-logo.svg)](https:\u002F\u002Ftelegram.org\u002F)\n [![](files\u002Fdiscord-logo.svg)](https:\u002F\u002Fwww.discord.com\u002F)\n [![](files\u002Fslack-logo.svg)](https:\u002F\u002Fslack.com\u002F)\n [![](files\u002Ffacebook-logo.svg)](https:\u002F\u002Fwww.messenger.com\u002F)\n \n \n**即将支持**\n\n[![](files\u002Fwhatsapp-logo.svg)](https:\u002F\u002Fwww.whatsapp.com\u002F)\n [![](files\u002Fvk-logo.svg)](https:\u002F\u002Fwww.vk.com\u002F)\n [![](files\u002Fviber-logo.svg)](https:\u002F\u002Fwww.viber.com\u002F)\n\n## [开始使用](https:\u002F\u002Furban-bot.now.sh\u002Fdocs\u002Fintro.html)\n## [API 文档](https:\u002F\u002Furban-bot.now.sh\u002Fdocs\u002Fcomponents.html)\n## 教程\n* [如何在 Telegram 中创建待办事项列表](https:\u002F\u002Fmedium.com\u002F@heresliker\u002Fhow-to-create-todo-list-telegram-bot-with-react-js-f9f77d22cc49)\n* [如何在 Telegram 中创建待办事项列表](https:\u002F\u002Fmedium.com\u002F@heresliker\u002F%D0%BA%D0%B0%D0%BA-%D1%81%D0%B4%D0%B5%D0%BB%D0%B0%D1%82%D1%8C-todo-list-%D1%87%D0%B0%D1%82-%D0%B1%D0%BE%D1%82%D0%B0-%D0%B2-telegram-%D1%81-%D0%BF%D0%BE%D0%BC%D0%BE%D1%89%D1%8C%D1%8E-react-js-d8a3c238ca91)\n\n## 安装\n请使用我们的零配置 [入门模板](https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot-starter-typescript)。\n#### TypeScript\n```\nnpx create-urban-bot my-app\n```\n#### JavaScript\n```\nnpx create-urban-bot my-app --template js\n```\n\n或者手动安装：\n```bash\nnpm i react @urban-bot\u002Fcore @urban-bot\u002Ftelegram @urban-bot\u002Ffacebook ...\n```\n\n## 示例\n![](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002Furban-bot_urban-bot_readme_40404aecb2fb.gif)\n![](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002Furban-bot_urban-bot_readme_44e715e7fac4.gif)\n```javascript\nimport React from 'react';\nimport { render, Route, Router, Root, Text, ButtonGroup, Button, useText } from '@urban-bot\u002Fcore';\nimport { UrbanBotTelegram } from '@urban-bot\u002Ftelegram';\nimport { UrbanBotSlack } from '@urban-bot\u002Fslack';\n\nfunction Echo() {\n    const [text, setText] = React.useState('Say something');\n\n    useText(({ text }) => {\n        setText(text);\n    });\n\n    return (\n        \u003CText>\n            \u003Ci>{text}\u003C\u002Fi>\n        \u003C\u002FText>\n    );\n}\n\nfunction Counter() {\n    const [count, setCount] = React.useState(0);\n\n    const increment = () => setCount(count + 1);\n    const decrement = () => setCount(count - 1);\n\n    return (\n        \u003CButtonGroup title={count} isNewMessageEveryRender={false}>\n            \u003CButton onClick={increment}>+1\u003C\u002FButton>\n            \u003CButton onClick={decrement}>-1\u003C\u002FButton>\n        \u003C\u002FButtonGroup>\n    );\n}\n\nfunction App() {\n    return (\n        \u003CRouter>\n            \u003CRoute path=\"\u002Fecho\">\n                \u003CEcho \u002F>\n            \u003C\u002FRoute>\n            \u003CRoute path=\"\u002Fcounter\">\n                \u003CCounter \u002F>\n            \u003C\u002FRoute>\n        \u003C\u002FRouter>\n    );\n}\n\nconst urbanBotTelegram = new UrbanBotTelegram({\n    token: 'telegramToken',\n});\n\nconst urbanBotSlack = new UrbanBotSlack({\n    signingSecret: 'slackSigningSecret',\n    token: 'slackToken',\n});\n\nrender(\n    \u003CRoot bot={urbanBotTelegram}>\n        \u003CApp \u002F>\n    \u003C\u002FRoot>\n);\n\nrender(\n    \u003CRoot bot={urbanBotSlack}>\n        \u003CApp \u002F>\n    \u003C\u002FRoot>\n);\n```","# Urban Bot 快速上手指南\n\nUrban Bot 是一个基于 React 的通用聊天机器人库。它允许开发者使用声明式的 React 组件构建机器人，无需深入了解各即时通讯软件（如 Telegram、Slack、Facebook Messenger）的底层 API，实现“一次编写，多端运行”。\n\n## 环境准备\n\n在开始之前，请确保您的开发环境满足以下要求：\n\n*   **操作系统**：Windows、macOS 或 Linux\n*   **Node.js**：建议安装 LTS 版本（v14 或更高版本）\n*   **包管理器**：npm 或 yarn\n*   **前置知识**：具备基础的 React 和 JavaScript\u002FTypeScript 知识\n\n> **提示**：国内开发者建议使用淘宝镜像源加速依赖安装：\n> `npm config set registry https:\u002F\u002Fregistry.npmmirror.com`\n\n## 安装步骤\n\n推荐使用官方提供的零配置启动器来初始化项目。\n\n### 方式一：使用 TypeScript（推荐）\n\n```bash\nnpx create-urban-bot my-app\n```\n\n### 方式二：使用 JavaScript\n\n```bash\nnpx create-urban-bot my-app --template js\n```\n\n执行上述命令后，进入项目目录并安装依赖：\n\n```bash\ncd my-app\nnpm install\n```\n\n### 方式三：手动安装\n\n如果您希望将 Urban Bot 集成到现有项目中，需手动安装核心库及对应平台的适配器：\n\n```bash\nnpm i react @urban-bot\u002Fcore @urban-bot\u002Ftelegram @urban-bot\u002Fslack @urban-bot\u002Ffacebook\n```\n*(注：根据目标平台选择安装对应的 `@urban-bot\u002F\u003Cplatform>` 包)*\n\n## 基本使用\n\nUrban Bot 的核心概念是使用 React 组件来描述机器人的交互逻辑。以下是一个最简单的示例，展示了如何创建一个支持文本回显和计数器的机器人，并可同时部署到 Telegram 和 Slack。\n\n创建或编辑入口文件（如 `src\u002Findex.tsx` 或 `src\u002Findex.js`）：\n\n```javascript\nimport React from 'react';\nimport { render, Route, Router, Root, Text, ButtonGroup, Button, useText } from '@urban-bot\u002Fcore';\nimport { UrbanBotTelegram } from '@urban-bot\u002Ftelegram';\nimport { UrbanBotSlack } from '@urban-bot\u002Fslack';\n\n\u002F\u002F 文本回显组件\nfunction Echo() {\n    const [text, setText] = React.useState('Say something');\n\n    useText(({ text }) => {\n        setText(text);\n    });\n\n    return (\n        \u003CText>\n            \u003Ci>{text}\u003C\u002Fi>\n        \u003C\u002FText>\n    );\n}\n\n\u002F\u002F 计数器组件\nfunction Counter() {\n    const [count, setCount] = React.useState(0);\n\n    const increment = () => setCount(count + 1);\n    const decrement = () => setCount(count - 1);\n\n    return (\n        \u003CButtonGroup title={count} isNewMessageEveryRender={false}>\n            \u003CButton onClick={increment}>+1\u003C\u002FButton>\n            \u003CButton onClick={decrement}>-1\u003C\u002FButton>\n        \u003C\u002FButtonGroup>\n    );\n}\n\n\u002F\u002F 主应用路由\nfunction App() {\n    return (\n        \u003CRouter>\n            \u003CRoute path=\"\u002Fecho\">\n                \u003CEcho \u002F>\n            \u003C\u002FRoute>\n            \u003CRoute path=\"\u002Fcounter\">\n                \u003CCounter \u002F>\n            \u003C\u002FRoute>\n        \u003C\u002FRouter>\n    );\n}\n\n\u002F\u002F 配置 Telegram 机器人\nconst urbanBotTelegram = new UrbanBotTelegram({\n    token: 'YOUR_TELEGRAM_BOT_TOKEN',\n});\n\n\u002F\u002F 配置 Slack 机器人\nconst urbanBotSlack = new UrbanBotSlack({\n    signingSecret: 'YOUR_SLACK_SIGNING_SECRET',\n    token: 'YOUR_SLACK_BOT_TOKEN',\n});\n\n\u002F\u002F 渲染机器人实例\nrender(\n    \u003CRoot bot={urbanBotTelegram}>\n        \u003CApp \u002F>\n    \u003C\u002FRoot>\n);\n\nrender(\n    \u003CRoot bot={urbanBotSlack}>\n        \u003CApp \u002F>\n    \u003C\u002FRoot>\n);\n```\n\n### 运行说明\n\n1.  将代码中的 `YOUR_TELEGRAM_BOT_TOKEN`、`YOUR_SLACK_SIGNING_SECRET` 等替换为您在实际平台申请的真实凭证。\n2.  运行启动命令（通常在 `package.json` 中定义为 `npm start` 或 `npm run dev`）。\n3.  在对应的即时通讯软件中找到您的机器人，发送 `\u002Fecho` 或 `\u002Fcounter` 即可体验功能。","一家初创电商团队希望快速构建一个跨平台客服机器人，同时覆盖 Telegram、Discord 和 Facebook Messenger 以响应用户咨询。\n\n### 没有 urban-bot 时\n- 开发团队必须分别研究 Telegram、Discord 和 Facebook 各自独立的 API 文档，学习成本极高且容易出错。\n- 每增加一个新渠道就需要重写一套业务逻辑代码，导致“待办事项查询”等核心功能在不同平台重复开发，维护困难。\n- 难以统一处理用户会话状态，不同平台的上下文管理方式各异，容易造成用户对话中断或数据不同步。\n- 前端与后端逻辑耦合严重，缺乏类似 React 的组件化思维，代码复用率极低，迭代新功能耗时漫长。\n\n### 使用 urban-bot 后\n- 团队只需利用熟悉的 React 语法编写声明式组件，完全屏蔽了底层各 messenger API 的差异，上手即用。\n- 实现“一次编写，多端运行”，同一套 `\u003CCounter>` 或 `\u003CEcho>` 组件可直接部署到所有支持的聊天软件，极大提升开发效率。\n- 依托内置的 Session 机制，应用自动为每个聊天渲染独立实例，像开发客户端页面一样自然管理用户状态。\n- 借助完整的 TypeScript 支持和可复用组件库，团队能轻松在不同机器人项目间共享逻辑，显著降低长期维护成本。\n\nurban-bot 让开发者从繁琐的多平台适配中解放出来，真正专注于用 React 思维构建通用的聊天体验。","https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002Furban-bot_urban-bot_4dcc22b6.jpg","Urban Bot","https:\u002F\u002Foss.gittoolsai.com\u002Favatars\u002Furban-bot_fcf3bc19.png","",null,"https:\u002F\u002Fgithub.com\u002Furban-bot",[81,85],{"name":82,"color":83,"percentage":84},"TypeScript","#3178c6",94.4,{"name":86,"color":87,"percentage":88},"JavaScript","#f1e05a",5.6,572,32,"2026-04-02T05:48:52","MIT","未说明","不需要",{"notes":96,"python":94,"dependencies":97},"该工具是基于 React 的聊天机器人库，运行环境为 Node.js，非 Python 项目。无需 GPU。支持多平台（Telegram, Discord, Slack, Facebook Messenger 等）。建议使用官方提供的 starter 模板（create-urban-bot）进行初始化，支持 TypeScript 和 JavaScript。",[98,99,100,101,102,103],"react","@urban-bot\u002Fcore","@urban-bot\u002Ftelegram","@urban-bot\u002Fslack","@urban-bot\u002Ffacebook","typescript (可选)",[13,26,14,54],[98,106,107,108,109,110,111,112,113,114,115,116,117,118,119],"chatbot","chatbots","telegram","telegram-bot","facebook-messenger-bot","slack-bot","bot","bot-framework","redux","mobx","reactjs","discord","discord-bot","discord-js","2026-03-27T02:49:30.150509","2026-04-06T07:14:26.483529",[123,128,133,138,143,148],{"id":124,"question_zh":125,"answer_zh":126,"source_url":127},15150,"如何在路由中使用正则表达式时控制组件重新挂载（混合 isNewMessageEveryRender 行为）？","可以通过将 `isNewMessageEveryRender` 保存在状态中，并在执行特定操作前动态修改它来实现。例如，当用户搜索新产品时设置为 true 以创建新消息，而在切换“下一个\u002F上一个”产品时设置为 false 以更新现有消息。\n\n代码示例：\n```js\nconst [isNewMessageEveryRender, setIsNewMessageEveryRender] = useState(false);\n\nuseText(({text}) => {\n    setIsNewMessageEveryRender(true);\n    \u002F\u002F ...\n})\n\nfunction clickNextProduct() {\n     setIsNewMessageEveryRender(false);\n     \u002F\u002F ...    \n}\n\n\u003CImage\n    isNewMessageEveryRender={isNewMessageEveryRender}\n    \u002F\u002F ...\n\u002F>\n```","https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot\u002Fissues\u002F151",{"id":129,"question_zh":130,"answer_zh":131,"source_url":132},15151,"Urban-bot 是否支持 Discord 平台及其最新功能（如斜杠命令和按钮）？","是的，Discord 支持已通过 HTTP API 实现的斜杠命令和按钮等功能，现在可以在 Urban-bot 上实现与其他平台类似的大部分功能。维护者已将 Discord 支持添加到库中，用户可以尝试使用并反馈。","https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot\u002Fissues\u002F75",{"id":134,"question_zh":135,"answer_zh":136,"source_url":137},15152,"如何在 Route 中使用路由参数（如 :id）并通过 useRouter 获取？","虽然原生语法可能尚未完全支持类似 `\u002Fpath-with\u002F:id` 的直接写法，但社区提出了集成外部路由器（如 react-router 或 reach-router）的方案来实现此功能。你可以参考相关提案来扩展路由参数处理能力。","https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot\u002Fissues\u002F109",{"id":139,"question_zh":140,"answer_zh":141,"source_url":142},15153,"是否有使用 Redux 的状态管理示例？","有的，社区已经创建了基于 Redux 的应用示例，并将其添加到了官方仓库的 examples 目录中。你可以查看该示例学习如何在 Urban-bot 项目中集成 Redux。","https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot\u002Fissues\u002F95",{"id":144,"question_zh":145,"answer_zh":146,"source_url":147},15154,"Urban-bot 是否提供 TypeScript 类型定义？","目前项目正在重写为 TypeScript。早期阶段仅对公共实体编写了外部 TypeScript 类型定义，后续计划将整个 urban-bot 重构为 TypeScript 以提供更完整的类型支持。","https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot\u002Fissues\u002F8",{"id":149,"question_zh":150,"answer_zh":151,"source_url":152},15155,"文档中的链接颜色显示异常如何解决？","该问题是由于主题配置引起的，维护者已更改了文档主题，链接颜色显示异常的问题随之解决。","https:\u002F\u002Fgithub.com\u002Furban-bot\u002Furban-bot\u002Fissues\u002F111",[]]