# BlogHub **Repository Path**: mantoucode/blog-hub ## Basic Information - **Project Name**: BlogHub - **Description**: 使用Cursor AI创建的博客管理系统 - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2025-06-06 - **Last Updated**: 2025-06-07 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # BlogHub - 现代博客管理系统

版本 许可 Node.js版本

BlogHub是一个现代化的全栈博客管理系统，采用微前端架构和模块联邦技术，支持多端响应式设计和完整的DevOps流程。系统具备强大的内容管理、用户权限控制和SEO优化功能，适用于个人博客、企业内容管理等多种场景。 ## 技术栈 ### 前端 - **基座应用**：Vue3 + Vite + TypeScript - **管理后台**：Vue3 + Element Plus + Pinia - **博客展示端**：Vue3 + Element Plus + Vant（移动端）+ SCSS - **共享模块**：TypeScript通用组件库 + axios封装 ### 后端 - **框架**：Koa2 + TypeScript - **数据库**： - MySQL（文章/用户数据） - Redis（会话/热点数据） - Elasticsearch（全文检索） - **其他**： - JWT认证 - OSS文件上传 - WebSocket实时通知 ## 项目结构 ``` BlogHub/ ├─ deploy/ # 部署相关配置 │ ├─ docker/ # Docker配置 │ └─ k8s/ # Kubernetes配置 ├─ packages/ # 前端微应用 │ ├─ admin/ # 管理后台 │ │ └─ src/ # 源代码 │ ├─ blog/ # 博客展示端 │ │ └─ src/ # 源代码 │ ├─ host/ # 基座应用 │ │ └─ src/ # 源代码 │ └─ shared/ # 共享模块 │ └─ src/ # 源代码 └─ server/ # 后端服务 ├─ config/ # 配置文件 ├─ scripts/ # 脚本文件 ├─ src/ # 源代码 │ ├─ controllers/ # 控制器 │ ├─ database/ # 数据库连接 │ ├─ middlewares/ # 中间件 │ ├─ models/ # 数据模型 │ ├─ routes/ # 路由 │ └─ services/ # 业务逻辑 └─ tests/ # 测试文件 ``` ## 功能特点 ### 管理端（PC） 1. **内容管理** - Markdown编辑器（支持图片上传） - 文章分类/标签管理 - 评论审核系统 - 数据看板（访问量/用户增长统计） 2. **用户权限** - RBAC角色控制（管理员/编辑/访客） - JWT身份验证 3. **SEO工具** - 自定义URL/Slug生成 - Meta标签编辑器 ### 展示端（PC + Mobile + Pad） 1. **响应式设计** - 三端自适应布局（Tailwind CSS + Flex/Grid） - 移动端优先的交互设计 2. **多模式渲染** - 静态生成（SSG）用于文章页 - 客户端渲染（CSR）用于管理后台 3. **增强功能** - 暗黑模式切换 - 文章全文检索（Elasticsearch集成） ## 安装与启动 ### 前提条件 - Node.js 16+ - MySQL 8.0+ - Redis 6.0+ - Elasticsearch 7.x ### 本地开发环境搭建 1. 克隆仓库 ```bash git clone https://gitee.com/mantoucode/blog-hub.git cd blog-hub ``` 2. 安装依赖 ```bash # 安装根目录依赖 npm install # 安装所有子项目依赖 npm run install:all ``` 3. 配置环境变量 开发环境和生产环境的配置文件已经预设，如需自定义可修改： - `server/.env.development` - 开发环境配置 - `server/.env.production` - 生产环境配置 4. 初始化数据库 确保MySQL服务已启动，然后执行： ```bash npm run db:init ``` 5. 启动开发服务器 ```bash # 启动所有服务 npm run dev # 或者分别启动各个服务 npm run dev:host # 基座应用 npm run dev:admin # 管理后台 npm run dev:blog # 博客展示端 npm run dev:server # 后端服务 ``` 访问地址： - 基座应用：http://localhost:5000 - 管理后台：http://localhost:5001 - 博客展示端：http://localhost:5002 - 后端API服务：http://localhost:3000 ## 构建与部署 ### 构建 ```bash # 构建所有前端应用 npm run build:packages # 构建后端服务 npm run build:server ``` ### Docker部署 项目提供了Docker和Kubernetes配置文件，可以快速部署到容器环境： ```bash # 使用Docker Compose启动所有服务 docker-compose -f deploy/docker/docker-compose.yml up -d ``` ### Kubernetes部署 ```bash # 部署到Kubernetes集群 kubectl apply -f deploy/k8s/ ``` ## 开发指南 ### 项目结构说明 - **微前端架构**：项目采用模块联邦实现微前端架构，各子应用可独立开发、部署 - **Monorepo管理**：使用Lerna和Workspaces管理多包项目 - **共享组件**：通过shared包共享通用组件和工具函数 ### 开发规范 1. **代码风格**：项目使用ESLint和Prettier确保代码风格一致 2. **Git工作流**： - 主分支：`master`（生产环境）和`develop`（开发环境） - 功能分支：`feature/xxx` - 修复分支：`fix/xxx` 3. **提交规范**： - 格式：`type(scope): message` - 类型：`feat`、`fix`、`docs`、`style`、`refactor`、`test`、`chore`等 ### 测试 ```bash # 运行所有测试 npm run test ``` ## 常见问题 ### 1. 无法连接数据库 确保MySQL服务已启动，并且`.env`文件中的连接信息正确。 ### 2. 模块联邦加载失败 检查各子应用的端口是否正确，以及`vite.config.ts`中的模块联邦配置是否一致。 ### 3. 图片上传失败 确保文件上传服务配置正确，检查OSS配置或本地存储路径权限。 ## 贡献指南 欢迎提交问题和功能需求！如果您想贡献代码，请遵循以下步骤： 1. Fork本仓库 2. 创建您的特性分支 (`git checkout -b feature/amazing-feature`) 3. 提交您的更改 (`git commit -m 'feat: add some amazing feature'`) 4. 推送到分支 (`git push origin feature/amazing-feature`) 5. 打开Pull Request ## 版本历史 - 1.0.0 (2023-09-01) - 首次发布 ## 许可证 本项目采用MIT许可证 - 详情请参阅 [LICENSE](LICENSE) 文件 ## 联系方式 - 项目维护者：WY - 项目仓库：[https://gitee.com/mantoucode/blog-hub.git](https://gitee.com/mantoucode/blog-hub.git) - 问题反馈：请提交Issue