做网站要学习什么,wordpress 搜索调用,网站推广做多大尺寸,一级造价工程师专业今天推荐一个可以快速开发 ChatGPT UI 界面的组件库#xff0c;质量很高#xff0c;拿来就能用。
Lobe UI 是由 lobehub 团队开发的一套 web UI 组件库#xff0c;和我之前推荐的很多通用型的 UI 组件库不同#xff0c;Lobe UI 是专门为目前火热的 AIGC 应用开发而打造质量很高拿来就能用。
Lobe UI 是由 lobehub 团队开发的一套 web UI 组件库和我之前推荐的很多通用型的 UI 组件库不同Lobe UI 是专门为目前火热的 AIGC 应用开发而打造让我们可以快速构建出类似于 ChatGPT 这样的指令输入型生成式 AI 应用。 高性能速度快Lobe UI 在运行时会自动裁剪不必要的样式属性组件性能很高支持主题定制官方提供了一种简单的方法来自定义主题我们可以更改颜色、字体等外观轻松构建符合自身产品主题的界面支持 light / dark 界面支持自动暗模式识别原理是 NextUI 在检测到 HTML theme prop 变化时自动更改主题。
Lobe UI 能做什么
ChatGPT 已经爆火了一年多了我们知道通过申请 OpenAi 的账号我们可以拥有 ChatGPT 的能力来将 ChatGPT 的能力接入到自己产品中。现在国内很多大厂出品的 AI 产品也都提供这样的开发服务。
不知道大家在工作中有没有接到要搭建 AIGC 的需求今天向大家推荐的 Lobe UI就是专门用来开发聊天式 AIGC 应用的 UI 套件这套组件内置了很多拿来就直接用的组件完全不需要自己来早轮子可以让我们以极快的速度搭建应用。 安装 Lobe UI
需要注意的是Lobe UI 包仅支持 ESM使用 使用 NextJS 编译所以只能使用下面这种方式安装
为了正确使用 nextjs ssr需要在 next.config.js 中添加 transpilePackages: [‘lobehub/ui’]比如
组件使用示范
Lobe UI 组件是基于 Antd 组件开发的所以和 Antd 组件完全兼容我们可以使用 Antd 样式作为默认的 css-in-js 样式解决方案。
这样就可以开始开发我们的 GPT 应用了。
LobeUI 官方提供了很多 AIGC 专用的组件比如指令输入框、表情选择器、聊天图标、聊天窗口、聊天消息列表等都是非常实用的组件开发 GPT 界面几乎都要用到。 看到这些组件打破了我原来以为一个 GPT 应用非常简单的刻板印象界面简洁、容易上手其实是产品和 UI 设计能力的体现但要开发出来完整的应用复杂程度一点也不小。 在官方的组件文档中有完善的参数说明和代码例子不过目前只有英文文档好在借助翻译工具阅读起来也不是太难我大概翻了一下很多时候其实不需要翻译文档写得很清楚也都是前端开发常见的那些单词很容易上手。
Lobe UI 是一套免费开源的前端 UI 组件库开发团队 lobehub 已经把项目的源代码基于 MIT 开源协议完全开放根据这个协议我们可以自由地下载来使用放心用在个人和商业项目上。
原文链接https://www.thosefree.com/lobe-ui
