# AI-Chat

**Repository Path**: wenxiaod/AI-Chat

## Basic Information

- **Project Name**: AI-Chat
- **Description**: AI聊天工具，桌面端/web端AI聊天问答软件，需要配置API，具备支持多种AI模型切换，实时显示AI回复内容，支持代码高亮、表格、列表等，支持浅色、深色、绿色三种主题，会话历史持久化存储，图片发送等功能。
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 10
- **Forks**: 0
- **Created**: 2026-03-30
- **Last Updated**: 2026-04-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# AI Chat - AI聊天工具

## 项目信息
## 技术栈：Vue + Vite + Tauri

| 类别 | 技术 |
|------|------|
| 前端框架 | Vue 3 (Composition API) |
| 构建工具 | Vite |
| UI组件 | Element Plus |
| 状态管理 | Pinia |
| 样式 | SCSS + CSS Variables |
| Markdown | marked + highlight.js |
| 后端框架 | Tauri 2.x |
| 数据库 | SQLite (@tauri-apps/plugin-sql) |
| HTTP | @tauri-apps/plugin-http |
---

## 功能特性

- **多模型支持**: 支持多种AI模型切换
- **流式输出**: 实时显示AI回复内容
- **Markdown渲染**: 支持代码高亮、表格、列表等
- **代码块增强**: 一键复制、主题切换（light/dark/auto）
- **多主题切换**: 支持浅色、深色、绿色三种主题
- **历史记录**: 会话历史持久化存储
- **图片支持**: 支持发送图片进行多模态对话
- **自定义API**: 支持配置自定义API地址和Key

## 使用说明

配置API相关信息后即可开始聊天。历史数据存储于SQLite数据库（打包后）或localStorage（开发模式）。

**数据存储位置：**
- Windows: `C:\Users\<用户名>\AppData\Roaming\AI Chat\ai_chat.db`
- 开发模式: 浏览器 localStorage (`ai_chat_db`)

---

## 项目截图

|           主界面            |            API配置             |
|:-------------------------:|:---------------------------:|
| ![主界面](screenshot/01.png) | ![API配置](screenshot/02.png) |

|            浅色主题            |           深色主题            |
|:--------------------------:|:--------------------------:|
| ![浅色主题](screenshot/03.png) | ![深色主题](screenshot/04.png) |

|            绿色主题            |         用户配置         |
|:--------------------------:|:--------------------------:|
| ![绿色主题](screenshot/05.png) | ![用户配置](screenshot/06.png) |

---

## 项目结构

```
tauri_ai_view/
├── src/                          # 前端源码
│   ├── components/               # Vue组件
│   │   ├── ChatArea.vue         # 聊天区域
│   │   ├── ChatInput.vue        # 输入框
│   │   ├── MessageList.vue      # 消息列表
│   │   ├── Sidebar.vue          # 侧边栏
│   │   ├── ThemeSwitch.vue      # 主题切换
│   │   └── TitleBar.vue         # 标题栏
│   ├── stores/                   # Pinia状态管理
│   │   ├── chat.ts              # 聊天状态
│   │   ├── settings.ts          # 设置状态
│   │   └── user.ts              # 用户状态
│   ├── utils/                    # 工具函数
│   │   ├── api.ts               # API调用
│   │   ├── markdown.ts          # Markdown渲染
│   │   └── theme.ts             # 主题管理
│   ├── db/                       # 数据库
│   │   └── database.ts          # SQLite/localStorage
│   ├── styles/                   # 样式文件
│   │   ├── variables.scss       # CSS变量
│   │   └── element-plus.scss    # Element Plus样式
│   ├── assets/                   # 静态资源
│   ├── App.vue                   # 主组件
│   └── main.ts                   # 入口文件
│
├── src-tauri/                    # Tauri后端
│   ├── src/
│   │   ├── main.rs              # Rust入口
│   │   └── lib.rs               # Rust库
│   ├── tauri.conf.json          # Tauri配置
│   ├── Cargo.toml               # Rust依赖
│   └── icons/                   # 应用图标
│
├── screenshot/                   # 项目截图
├── package.json                  # npm配置
├── vite.config.ts               # Vite配置
└── README.md                     # 项目说明
```

---

## 运行项目

### 开发模式

```bash
# 安装依赖
npm install

# 启动开发服务器
npm run tauri dev
```

**说明：**
- 自动启动前端开发服务器
- 自动编译 Rust 后端
- 打开桌面窗口
- 支持热重载

---

### 构建发布版本

```bash
npm run tauri build
```

**输出位置：**
- Windows: `src-tauri/target/release/bundle/nsis/`

---

## 常用命令

| 命令 | 说明                            |
|------|-------------------------------|
| `npm run dev` | 启动开发模式 - web端                 |
| `npm run build` | 构建发布版本 - web端                 |
| `npm run tauri dev` | 启动开发模式                        |
| `npm run tauri build` | 构建发布版本  同时打包setup安装包、exe可执行程序 |
    setup安装包路径：tauri_ai_view\src-tauri\target\release\bundle\nsis\AI Chat_0.1.0_x64-setup.exe
    exe可执行程序路径：\src-tauri\target\release\ai-chat.exe
---