94 lines
3.2 KiB
Markdown
94 lines
3.2 KiB
Markdown
# 翁爷语录 (WengyeYulu) - 聊天记录归档查看器
|
||
|
||
这是一个基于 **Bun** + **Elysia** + **React** 构建的全栈聊天记录归档与查看应用。它演示了如何使用现代高性能 TypeScript 运行时 Bun 构建端到端类型安全(End-to-End Type Safety)的 Web 应用。
|
||
|
||
## 🛠 技术栈
|
||
|
||
本项目采用以下前沿技术构建:
|
||
|
||
### 核心运行时
|
||
- **[Bun](https://bun.sh)**: 极速的 TypeScript 运行时、打包器和包管理器。
|
||
|
||
### 后端 (Backend)
|
||
- **[ElysiaJS](https://elysiajs.com)**: 基于 Bun 的高性能 Web 框架。
|
||
- **[Bun:sqlite](https://bun.sh/docs/api/sqlite)**: Bun 内置的高性能 SQLite 驱动。
|
||
- **TypeScript**: 全后端类型支持。
|
||
|
||
### 前端 (Frontend)
|
||
- **[React 19](https://react.dev)**: 用于构建用户界面。
|
||
- **[@elysiajs/eden](https://elysiajs.com/eden/overview.html)**: 实现了**端到端类型安全**。前端直接调用后端 API 类型,无需手动编写 Fetch 代码或类型定义。
|
||
- **[TailwindCSS](https://tailwindcss.com)**: 实用优先的 CSS 框架。
|
||
- **[Lucide React](https://lucide.dev)**: 漂亮的图标库。
|
||
|
||
### 部署 (Deployment)
|
||
- **Docker**: 容器化部署。
|
||
- **Docker Compose**: 服务编排。
|
||
- **Traefik**: 支持并预配置了 Traefik 标签,方便作为反向代理接入。
|
||
|
||
## ✨ 功能特性
|
||
|
||
- **端到端类型安全**: 后端修改 API 定义,前端类型自动更新,开发体验极佳。
|
||
- **微信风格 UI**: 仿微信 PC 端界面,简洁熟悉。
|
||
- **高性能**: 利用 Bun 和 SQLite 的高性能特性,秒级加载大量聊天记录。
|
||
- **全文搜索**: 支持实时搜索聊天内容。
|
||
- **数据导入**: 包含管理员后台,支持导入 JSON 格式的聊天记录。
|
||
|
||
## 🚀 快速开始 (开发模式)
|
||
|
||
### 前置要求
|
||
请确保已安装 [Bun](https://bun.sh/docs/installation)。
|
||
|
||
### 1. 安装依赖
|
||
```bash
|
||
bun install
|
||
```
|
||
|
||
### 2. 启动开发服务器
|
||
```bash
|
||
bun dev
|
||
```
|
||
服务器将在 `http://localhost:3000` 启动。
|
||
* Bun 会自动处理前端资源的 HMR(热更新)。
|
||
* 后端 API 变更也会自动重启。
|
||
|
||
## 🐳 Docker 部署 (生产环境)
|
||
|
||
本项目提供了完整的 Docker 支持,包含 Traefik 标签配置,适合在生产环境中部署。
|
||
|
||
### 1. 配置环境变量
|
||
复制示例配置文件并设置你的域名:
|
||
|
||
```bash
|
||
cp .env.example .env
|
||
```
|
||
打开 `.env` 文件,修改 `DOMAIN_NAME` 为你的实际域名(例如 `chat.example.com`)。如果不修改,Traefik 将默认监听 `example.com`。
|
||
|
||
### 2. 启动服务
|
||
使用 Docker Compose 一键启动:
|
||
|
||
```bash
|
||
docker-compose up -d --build
|
||
```
|
||
|
||
### 3. 数据持久化
|
||
所有数据(SQLite 数据库文件)将保存在项目根目录下的 `./data` 文件夹中,容器重启或删除后数据不会丢失。
|
||
|
||
## 📂 项目结构
|
||
|
||
```
|
||
src/
|
||
├── backend/ # 后端代码
|
||
│ ├── api.ts # Elysia API 定义
|
||
│ ├── db.ts # 数据库连接与 Schema
|
||
│ └── index.ts # 服务端入口
|
||
└── frontend/ # 前端代码
|
||
├── client.ts # Eden 客户端 (API 类型推断)
|
||
├── components/ # React 组件
|
||
├── App.tsx # 主应用逻辑
|
||
└── index.tsx # 前端入口
|
||
```
|
||
|
||
## 📝 许可证
|
||
|
||
MIT License
|