将所有 GitHub 相关引用更新为 XCCGit,包括仓库地址、Issues 页面和 Releases 页面 简化构建流程说明,添加项目地址到开发者文档
298 lines
7.4 KiB
Markdown
298 lines
7.4 KiB
Markdown
# 开发者指南
|
||
|
||
## 概述
|
||
|
||
本指南旨在帮助开发者理解 DeEarthX-CE 项目的架构和开发流程,以便能够顺利地为项目做出贡献。
|
||
|
||
项目地址: [https://git.xcclyc.com.cn/xcclyc/DeEarthX-CE.git](https://git.xcclyc.com.cn/xcclyc/DeEarthX-CE.git)
|
||
|
||
## 项目架构
|
||
|
||
DeEarthX-CE 采用前后端分离架构:
|
||
|
||
- **后端**:使用 TypeScript 开发,提供核心功能和 API
|
||
- **前端**:使用 Vue 3 + Vite 开发,提供用户界面
|
||
- **打包工具**:使用 Tauri 打包为桌面应用
|
||
|
||
## 目录结构
|
||
|
||
### 后端目录结构
|
||
|
||
```
|
||
backend/
|
||
├── src/
|
||
│ ├── dearth/ # 核心功能模块
|
||
│ │ ├── strategies/ # 模组过滤策略
|
||
│ │ ├── utils/ # 工具函数
|
||
│ │ ├── ModCheckService.ts # 模组检查服务
|
||
│ │ ├── ModFilterService.ts # 模组过滤服务
|
||
│ │ └── index.ts # 核心模块入口
|
||
│ ├── modloader/ # 模组加载器相关功能
|
||
│ ├── platform/ # 平台集成模块
|
||
│ ├── template/ # 模板管理模块
|
||
│ ├── utils/ # 通用工具函数
|
||
│ ├── Dex.ts # 核心类
|
||
│ ├── core.ts # 核心功能
|
||
│ ├── galaxy.ts # Galaxy 模式功能
|
||
│ └── main.ts # 主入口
|
||
├── package.json # 后端依赖
|
||
└── tsconfig.json # TypeScript 配置
|
||
```
|
||
|
||
### 前端目录结构
|
||
|
||
```
|
||
front/
|
||
├── src/
|
||
│ ├── components/ # 组件
|
||
│ ├── views/ # 页面视图
|
||
│ ├── utils/ # 工具函数
|
||
│ ├── assets/ # 资源文件
|
||
│ ├── App.vue # 根组件
|
||
│ └── main.ts # 主入口
|
||
├── lang/ # 语言文件
|
||
├── public/ # 静态资源
|
||
├── src-tauri/ # Tauri 配置
|
||
├── package.json # 前端依赖
|
||
└── vite.config.ts # Vite 配置
|
||
```
|
||
|
||
## 开发环境设置
|
||
|
||
### 前提条件
|
||
|
||
- **Node.js**:v16.0+(推荐使用最新稳定版)
|
||
- **pnpm**:v8.0+(包管理器)
|
||
- **Rust**:最新稳定版(用于 Tauri 构建)
|
||
- **Git**:用于版本控制
|
||
|
||
### 安装依赖
|
||
|
||
```bash
|
||
# 安装项目依赖
|
||
pnpm install
|
||
|
||
# 安装后端依赖
|
||
cd backend
|
||
pnpm install
|
||
|
||
# 安装前端依赖
|
||
cd ../front
|
||
pnpm install
|
||
```
|
||
|
||
### 启动开发服务器
|
||
|
||
```bash
|
||
# 启动前端开发服务器
|
||
cd front
|
||
pnpm run dev
|
||
|
||
# 启动后端开发服务器
|
||
cd ../backend
|
||
pnpm run dev
|
||
```
|
||
|
||
## 核心模块开发
|
||
|
||
### 模组检查服务
|
||
|
||
`ModCheckService` 负责检查模组的有效性和兼容性:
|
||
|
||
- **主要功能**:检查模组文件、验证模组信息、检测兼容性
|
||
- **关键方法**:
|
||
- `checkMod()`:检查模组的基本信息
|
||
- `checkModCompatibility()`:检查模组与游戏版本的兼容性
|
||
|
||
### 模组过滤服务
|
||
|
||
`ModFilterService` 负责根据不同策略过滤模组:
|
||
|
||
- **主要功能**:注册过滤策略、执行模组过滤
|
||
- **关键方法**:
|
||
- `filterMods()`:根据策略过滤模组
|
||
- `registerFilterStrategy()`:注册新的过滤策略
|
||
|
||
### 模板管理服务
|
||
|
||
`TemplateManager` 负责模板的创建、管理和应用:
|
||
|
||
- **主要功能**:创建模板、应用模板、导出模板
|
||
- **关键方法**:
|
||
- `createTemplate()`:创建新模板
|
||
- `applyTemplate()`:应用模板到指定目录
|
||
- `exportTemplate()`:导出模板为文件
|
||
|
||
## 平台集成开发
|
||
|
||
### CurseForge 集成
|
||
|
||
- **功能**:与 CurseForge API 交互,搜索和下载模组
|
||
- **关键方法**:
|
||
- `searchMods()`:搜索模组
|
||
- `getModDetails()`:获取模组详情
|
||
- `downloadMod()`:下载模组文件
|
||
|
||
### Modrinth 集成
|
||
|
||
- **功能**:与 Modrinth API 交互,搜索和下载模组
|
||
- **关键方法**:
|
||
- `searchMods()`:搜索模组
|
||
- `getModDetails()`:获取模组详情
|
||
- `downloadMod()`:下载模组文件
|
||
|
||
## 前端开发
|
||
|
||
### 组件开发
|
||
|
||
- **组件结构**:使用 Vue 3 Composition API
|
||
- **样式管理**:使用 Tailwind CSS
|
||
- **状态管理**:使用 Vue 的响应式系统
|
||
|
||
### 页面开发
|
||
|
||
- **Main.vue**:主页面,包含模式选择
|
||
- **DeEarthView.vue**:DeEarth 模式页面,用于模组管理
|
||
- **GalaxyView.vue**:Galaxy 模式页面,用于模板管理
|
||
- **SettingView.vue**:设置页面
|
||
- **AboutView.vue**:关于页面
|
||
|
||
## API 开发
|
||
|
||
### 后端 API
|
||
|
||
- **RESTful API**:提供模组管理、模板管理等功能
|
||
- **WebSocket API**:提供实时通信功能
|
||
|
||
### 前端 API 调用
|
||
|
||
- **HTTP 请求**:使用 axios 发送 API 请求
|
||
- **WebSocket**:使用 WebSocketHandler 组件进行实时通信
|
||
|
||
## 测试
|
||
|
||
### 单元测试
|
||
|
||
```bash
|
||
# 运行后端单元测试
|
||
cd backend
|
||
pnpm run test
|
||
|
||
# 运行前端单元测试
|
||
cd ../front
|
||
pnpm run test
|
||
```
|
||
|
||
### 集成测试
|
||
|
||
- **API 测试**:测试后端 API 的功能
|
||
- **端到端测试**:测试完整的用户流程
|
||
|
||
## 构建与部署
|
||
|
||
### 构建应用
|
||
|
||
```bash
|
||
# 全自动构建
|
||
pnpm run build
|
||
```
|
||
|
||
### 部署
|
||
|
||
- **桌面应用**:分发构建后的安装包
|
||
- **文档**:部署到 XCCGit Pages 或其他静态网站托管服务
|
||
|
||
## 代码规范
|
||
|
||
### TypeScript 规范
|
||
|
||
- 使用 TypeScript 官方推荐的代码风格
|
||
- 为所有函数和变量添加类型注解
|
||
- 使用接口定义复杂类型
|
||
|
||
### Vue 规范
|
||
|
||
- 遵循 Vue 3 风格指南
|
||
- 使用 Composition API
|
||
- 组件命名使用 PascalCase
|
||
|
||
### Rust 规范
|
||
|
||
- 遵循 Rust 官方代码风格
|
||
- 使用 `cargo fmt` 格式化代码
|
||
- 为公共 API 添加文档注释
|
||
|
||
## 调试技巧
|
||
|
||
### 后端调试
|
||
|
||
- 使用 VS Code 的 TypeScript 调试功能
|
||
- 查看日志输出
|
||
- 使用 `console.log()` 或 `debugger` 语句
|
||
|
||
### 前端调试
|
||
|
||
- 使用浏览器的开发者工具
|
||
- 查看控制台输出
|
||
- 使用 Vue DevTools 扩展
|
||
|
||
### Tauri 调试
|
||
|
||
- 使用 `tauri dev` 启动开发模式
|
||
- 查看 Tauri 日志
|
||
- 使用 Rust 调试工具
|
||
|
||
## 常见问题
|
||
|
||
### 依赖冲突
|
||
|
||
- 检查 package.json 中的依赖版本
|
||
- 使用 pnpm 管理依赖
|
||
- 运行 `pnpm dedupe` 解决依赖冲突
|
||
|
||
### 构建失败
|
||
|
||
- 检查 Node.js 和 Rust 版本
|
||
- 确保所有依赖都已正确安装
|
||
- 查看构建日志获取详细错误信息
|
||
|
||
### API 调用失败
|
||
|
||
- 检查网络连接
|
||
- 验证 API 端点是否正确
|
||
- 查看服务器日志获取详细错误信息
|
||
|
||
## 贡献流程
|
||
|
||
1. ** Fork 仓库**:在 XCCGit 上 fork 项目仓库
|
||
2. **克隆仓库**:克隆 fork 后的仓库到本地
|
||
3. **创建分支**:从 develop 分支创建新的功能分支
|
||
4. **开发代码**:实现功能或修复 bug
|
||
5. **运行测试**:确保代码通过所有测试
|
||
6. **提交代码**:使用规范的提交信息
|
||
7. **创建 PR**:向 develop 分支提交 Pull Request
|
||
8. **代码审查**:等待项目维护者的代码审查
|
||
9. **合并代码**:审查通过后,代码将被合并到 develop 分支
|
||
|
||
## 技术栈
|
||
|
||
- **后端**:TypeScript、Node.js
|
||
- **前端**:Vue 3、Vite、Tailwind CSS
|
||
- **打包**:Tauri
|
||
- **测试**:Jest、Vitest
|
||
- **版本控制**:Git
|
||
- **包管理**:pnpm
|
||
|
||
## 学习资源
|
||
|
||
- **Vue 3 文档**:https://v3.vuejs.org/
|
||
- **TypeScript 文档**:https://www.typescriptlang.org/docs/
|
||
- **Tauri 文档**:https://tauri.studio/docs/
|
||
- **Rust 文档**:https://doc.rust-lang.org/
|
||
- **Tailwind CSS 文档**:https://tailwindcss.com/docs/
|
||
|
||
## 联系方式
|
||
|
||
- **XCCGit Issues**:用于问题报告和功能请求
|
||
- **Discord**:用于实时讨论和社区交流
|
||
- **Email**:用于重要事项的沟通 |