SvelteChatKit：与提供商无关的AI聊天UI，支持OpenAI、Dify、n8n等

SvelteChatKit 是一个为 SvelteKit 2 和 Svelte 5（Runes）设计的完整流式聊天界面，能够通过一个统一接口与任何 LLM 后端通信。无论是 OpenAI 兼容 API、Ollama、Dify 还是自定义端点，只需更改配置对象即可切换，而 UI、状态管理、Markdown 渲染和持久化逻辑完全不变。如果你不希望聊天 UI 绑定在某一个供应商的 API 上，这个工具包就是为你准备的。

该工具包的主要特性包括：逐 token 流式渲染（支持 SSE、NDJSON 或纯文本流），并提供干净的中止按钮；提供商无关架构，通过一个 ChatProvider 接口即可添加新后端，无需改动核心代码；会话历史通过 localStorage 持久化（可选，SSR 安全）；支持 GFM 格式的 Markdown 渲染和 highlight.js 代码高亮，并使用 DOMPurify 进行净化；智能自动滚动，仅在用户接近底部时跟随流，当用户向上滚动时不会强制跳转，并提供一个浮动的“滚动到底部”按钮；完善的错误处理，带有类型化的 ChatProviderError 和可操作的消息；移动端响应式设计，支持 375px 宽度，16px 输入框（避免 iOS 缩放），自动增长文本区域；暗色模式通过 Tailwind dark: 变体实现；TypeScript 严格模式，完全类型化的公共 API；零配置演示模式，内置 mock 提供商无需 API 密钥即可运行。

支持的提供商包括：OpenAI 兼容（OpenAI、OpenRouter、Groq、LM Studio、vLLM、llama.cpp、Azure 风格网关），使用 SSE 传输；Ollama，使用 NDJSON 传输；Dify，使用 SSE 传输；自定义端点，自动检测传输方式（SSE、流式文本或纯文本）；以及内置的 mock 提供商用于演示。

快速开始：克隆仓库后执行 npm install，拷贝 .env.example 为 .env，然后运行 npm run dev 即可在 mock 提供商下开始聊天，无需任何密钥。填写 .env 文件可切换至真实后端。需要 Node 20 以上版本。

使用方式简单：创建提供商实例，传递给 Chat 实例，然后渲染 ChatWindow 组件。Chat 暴露了 runes 响应式的 messages、status、error 和 busy 状态，以及 send()、stop()、clear() 和 setProvider() 方法，你也可以基于它构建完全自定义的 UI。

添加自定义提供商仅需约 20 行代码：实现 ChatProvider 接口，然后通过 registerProvider 注册，之后即可通过工厂函数使用。工具包提供了详细的文档指导如何添加新提供商。

配置方面，默认可通过 .env 文件中的 PUBLIC_* 变量进行设置，所有变量均为可选。注意，PUBLIC_* 变量会嵌入客户端 bundle 中，因此生产环境中应将密钥保留在服务端，通过自定义端点代理添加 Authorization 头部。

架构上，组件层包括 ChatWindow、MessageList、MessageBubble、ChatInput、Markdown 和 TypingIndicator，状态管理由 Chat runes 类负责，底层通过 ChatProvider 接口与具体后端通信。传输层辅助函数包括 sseStream、lineStream、textStream 和 ensureOk。

项目的路线图包括：认证支持（会话作用域密钥、令牌刷新钩子）、向量数据库/RAG 集成助手、插件系统（消息中间件、自定义渲染器）、更多 UI 主题、文件附件、函数/工具调用 UI，以及发布为 npm 包。

SvelteChatKit 采用 MIT 许可，欢迎贡献代码、报告 bug 或提交新提供商。