XuJiacheng
5f0fa79606
- 创建项目核心文件：package.json、vite.config.js、.gitignore - 添加前后端基础依赖和开发工具配置 - 完善OpenSpec模块，包括项目文档和核心能力规格 - 配置ESLint和Prettier代码规范 - 创建基本目录结构 - 实现前端Vue3应用框架和路由 - 添加后端Express服务器和基础路由 - 编写README项目说明文档
129 lines
3.5 KiB
Markdown
129 lines
3.5 KiB
Markdown
# 完善前后端Node.js控制台项目的基础架构
|
||
|
||
## 1. 项目初始化
|
||
|
||
### 1.1 创建核心配置文件
|
||
- **package.json**: 初始化项目配置，包含项目基本信息、依赖管理、脚本命令等
|
||
- **vite.config.js**: 配置Vite打包工具，支持前后端分离开发
|
||
- **.gitignore**: 配置Git忽略文件，避免提交不必要的文件
|
||
|
||
### 1.2 安装核心依赖
|
||
- **前端依赖**: Vue 3.x、Vue Router、Axios等
|
||
- **后端依赖**: Express、Redis客户端、Cors等
|
||
- **开发依赖**: Vite、ESLint、Prettier等
|
||
|
||
## 2. 完善OpenSpec模块
|
||
|
||
### 2.1 更新openspec/project.md
|
||
- 详细描述项目目的和目标
|
||
- 明确技术栈：Vue 3.x、Node.js、Vite、Redis
|
||
- 定义代码风格、架构模式、测试策略和Git工作流
|
||
- 记录领域上下文和重要约束
|
||
- 文档外部依赖
|
||
|
||
### 2.2 创建规格文档
|
||
- 在openspec/specs/目录下创建核心能力规格
|
||
- **logging/spec.md**: 日志读取和展示功能规格
|
||
- **command/spec.md**: 控制台指令发送功能规格
|
||
- **redis-connection/spec.md**: Redis连接管理规格
|
||
|
||
### 2.3 创建设计文档
|
||
- 在openspec/specs/目录下为每个核心能力创建设计文档
|
||
- **logging/design.md**: 日志功能技术设计
|
||
- **command/design.md**: 指令功能技术设计
|
||
- **redis-connection/design.md**: Redis连接管理设计
|
||
|
||
## 3. 编写README.md
|
||
|
||
### 3.1 项目概述
|
||
- 项目名称、描述和主要功能
|
||
- 技术栈和架构说明
|
||
|
||
### 3.2 快速开始
|
||
- 环境要求
|
||
- 安装和运行步骤
|
||
|
||
### 3.3 项目结构
|
||
- 目录结构说明
|
||
- 核心文件功能介绍
|
||
|
||
### 3.4 功能模块
|
||
- 日志记录展示功能
|
||
- 控制台指令发送功能
|
||
|
||
### 3.5 开发指南
|
||
- 代码风格规范
|
||
- 开发流程
|
||
- 测试指南
|
||
|
||
### 3.6 部署说明
|
||
- 生产环境部署步骤
|
||
- 配置说明
|
||
|
||
## 4. 编写框架约束文件
|
||
|
||
### 4.1 ESLint配置
|
||
- **.eslintrc.js**: 配置代码质量检查规则
|
||
|
||
### 4.2 Prettier配置
|
||
- **.prettierrc**: 配置代码格式化规则
|
||
|
||
### 4.3 编辑器配置
|
||
- **.vscode/settings.json**: VS Code编辑器配置
|
||
|
||
## 5. 目录结构规划
|
||
|
||
```
|
||
Web_BLS_ProjectConsole/
|
||
├── .github/
|
||
│ └── prompts/
|
||
├── .vscode/
|
||
│ └── settings.json
|
||
├── openspec/
|
||
│ ├── project.md
|
||
│ ├── AGENTS.md
|
||
│ └── specs/
|
||
│ ├── logging/
|
||
│ │ ├── spec.md
|
||
│ │ └── design.md
|
||
│ ├── command/
|
||
│ │ ├── spec.md
|
||
│ │ └── design.md
|
||
│ └── redis-connection/
|
||
│ ├── spec.md
|
||
│ └── design.md
|
||
├── public/
|
||
│ └── index.html
|
||
├── src/
|
||
│ ├── frontend/
|
||
│ │ ├── assets/
|
||
│ │ ├── components/
|
||
│ │ ├── views/
|
||
│ │ ├── router/
|
||
│ │ ├── store/
|
||
│ │ └── main.js
|
||
│ └── backend/
|
||
│ ├── server.js
|
||
│ ├── routes/
|
||
│ ├── services/
|
||
│ └── config/
|
||
├── .eslintrc.js
|
||
├── .gitignore
|
||
├── .prettierrc
|
||
├── vite.config.js
|
||
├── package.json
|
||
└── README.md
|
||
```
|
||
|
||
## 6. 实施步骤
|
||
|
||
1. 初始化项目，创建package.json和vite.config.js
|
||
2. 安装核心依赖
|
||
3. 完善openspec/project.md
|
||
4. 创建核心能力规格文档和设计文档
|
||
5. 编写README.md
|
||
6. 配置ESLint和Prettier
|
||
7. 创建编辑器配置文件
|
||
8. 创建基本目录结构
|
||
|
||
这个计划将为项目搭建一个完整的基础架构，包括文档、配置和依赖管理，为后续实现具体功能做好准备。 |