Dependencies of Lobe Chat: Complete Package Architecture and Tech Stack
Lobe Chat manages its extensive dependency tree through a pnpm monorepo structure, with runtime packages defined in the root package.json and domain-specific dependencies organized across workspace packages under packages/* and apps/*.
Lobe Chat is an open-source AI chat framework developed by LobeHub that implements a modern React-based architecture. The project uses a pnpm workspace monorepo structure to organize its dependencies of Lobe Chat across multiple domains including UI rendering, state management, LLM integrations, and database persistence. This distributed approach allows the codebase to maintain clear separation between the web client, server APIs, agent runtimes, and desktop application.
UI and Frontend Stack
The user interface layer relies on the React ecosystem libraries defined in the root package.json. The project uses antd and antd-style for component styling, alongside internal design system packages including @lobehub/ui, @lobehub/icons, @lobehub/analytics, and @lobehub/charts.
Core React dependencies include react, react-dom, and react-router-dom for routing. The styling architecture leverages Ant Design's CSS-in-JS capabilities, with styled-components support via Ant Design's style engine.
State Management and API Layer
State synchronization combines zustand and zustand-utils for client-side stores with @tanstack/react-query and swr for server state management. The application implements type-safe API routes using the tRPC stack, including @trpc/react-query, @trpc/client, @trpc/server, and @trpc/next.
This combination enables real-time data synchronization between the React frontend and backend services, with type safety enforced across the full stack.
AI and LLM Provider SDKs
Lobe Chat connects to multiple large language model providers through dedicated SDKs listed in the [root package.json](https://github.com/lobehub/lobe-chat/blob/canary/package.json). The dependencies include openai for OpenAI integration, @anthropic-ai/sdk for Claude models, @google/genai for Gemini, and @aws-sdk/client-bedrock-runtime for AWS Bedrock access.
Additional providers include @azure-rest/ai-inference for Azure AI, @huggingface/inference for Hugging Face models, and ollama for local LLM execution. The AI orchestration layer uses langchain and @langchain/community, with @modelcontextprotocol/sdk for Model Context Protocol implementations. Observability is handled through langfuse for LLM tracing and cost monitoring.
Agent Runtime and Tooling
The core agent framework depends on @lobechat/agent-runtime, defined in packages/agent-runtime/package.json. This workspace package orchestrates AI agent execution and integrates with @lobechat/builtin-tools, @lobechat/builtin-agents, and @lobechat/builtin-skills for plugin management.
These internal packages are referenced in the root package.json and linked through pnpm workspaces, enabling modular updates to the agent system without affecting the main application bundle.
Database and Persistence Technologies
Data persistence relies on drizzle-orm and drizzle-kit for type-safe database operations, with @neondatabase/serverless and pg for PostgreSQL connections. The database schema definitions reside in packages/database/package.json, which encapsulates migration tools and ORM configurations.
Client-side storage uses dexie for IndexedDB management in browser environments. Background job processing utilizes @upstash/qstash and @upstash/workflow for serverless Redis-based queues and workflow orchestration.
File Processing and Media Handling
Binary data processing depends on sharp for image manipulation, pdfjs-dist and pdfkit for PDF parsing and generation, and ffmpeg-static for video/audio processing. Document parsing includes word-extractor for Microsoft Word files, mammoth for advanced Word document conversion, and file-type for format detection.
Compression and archive utilities include fflate for lightweight zlib-based compression, supporting client-side file operations without heavy native dependencies.
Authentication and Security Stack
User authentication implements better-auth with supporting libraries better-auth-harmony and extensions for passkey support (@better-auth/passkey) and Expo mobile compatibility (@better-auth/expo). JWT handling uses the modern jose library instead of legacy jsonwebtoken, providing Web Crypto API support for edge runtimes.
Observability and Internationalization
Monitoring and tracing depend on @opentelemetry/* packages for distributed tracing, posthog-js for product analytics, @vercel/analytics for web vitals, and winston for structured server-side logging. Error reporting integrates with @sentry/nextjs via OpenTelemetry instrumentation.
Localization uses i18next, react-i18next, i18next-browser-languagedetector, and i18next-resources-to-backend for loading translation resources, supporting the application's multi-language interface.
Desktop and Edge Runtime Dependencies
The desktop application defined in apps/desktop/package.json extends the web dependencies with Electron-specific packages including electron, @electron/remote, and @lobehub/desktop-ipc-typings for type-safe inter-process communication.
Edge runtime utilities for Vercel deployments include @vercel/edge-config for feature flags, @vercel/functions for serverless helpers, and @vercel/speed-insights for performance monitoring.
Installing and Managing Dependencies
To install all dependencies of Lobe Chat including internal workspace packages, run the following command from the repository root:
pnpm install
This command resolves the dependency tree across the entire monorepo, linking local packages such as @lobechat/agent-runtime and @lobechat/database according to the pnpm-workspace.yaml configuration.
Importing Dependencies in Application Code
Dependencies are imported directly in application entry points located in src/app/**/*.tsx. For example, UI components are imported from Ant Design and internal libraries:
import { Button } from 'antd';
import { useChat } from '@lobechat/agent-runtime';
import { User } from '@lobehub/ui';
LLM provider SDKs are instantiated with environment configuration:
import OpenAI from 'openai';
const client = new OpenAI({
apiKey: process.env.OPENAI_API_KEY
});
Summary
- Lobe Chat organizes its dependencies of Lobe Chat through a pnpm monorepo with a root
package.jsonand specialized workspace packages underpackages/*andapps/*. - The UI layer depends on React, Ant Design (
antd), and internal LobeHub libraries (@lobehub/ui,@lobehub/icons). - AI integrations span multiple providers including OpenAI, Anthropic, Google, Azure, and Hugging Face through their respective SDKs (
openai,@anthropic-ai/sdk,@google/genai). - Database operations use
drizzle-ormwith PostgreSQL/Neon support, while client storage usesdexiefor IndexedDB management. - Internal packages like
@lobechat/agent-runtime(defined inpackages/agent-runtime/package.json) and@lobechat/database(defined inpackages/database/package.json) isolate domain-specific dependencies. - The desktop client in
apps/desktop/package.jsonadds Electron-specific dependencies includingelectronand@electron/remoteto the base web stack.
Frequently Asked Questions
What package manager does Lobe Chat use for its dependencies?
Lobe Chat uses pnpm as its package manager, configured as a monorepo through pnpm-workspace.yaml. This enables efficient dependency deduplication across workspace packages located in packages/* and apps/*, reducing installation time and disk usage compared to npm or yarn.
Where are the main dependencies of Lobe Chat defined?
The primary runtime dependencies are listed in the root package.json file at the repository base. Domain-specific dependencies for the agent runtime, database layer, and desktop application are defined in their respective package.json files under packages/agent-runtime/package.json, packages/database/package.json, and apps/desktop/package.json.
How does Lobe Chat handle AI provider SDKs?
Lobe Chat includes direct dependencies on official SDKs for each provider, including openai, @anthropic-ai/sdk, @google/genai, @aws-sdk/client-bedrock-runtime, and @azure-rest/ai-inference. These are imported directly into application code in src/app/**/*.tsx files and instantiated with environment-specific configuration.
What is the difference between dependencies in the root package.json versus workspace packages?
The root package.json contains shared dependencies such as React, Ant Design, and LLM SDKs used across the entire application. Workspace packages like @lobechat/agent-runtime isolate domain-specific dependencies—for example, specific LangChain versions or database drivers—keeping the main dependency tree clean and enabling independent versioning of internal modules.
Have a question about this repo?
These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:
curl -s "https://instagit.com/install.md" Maintain an open-source project? Get it listed too →