Skip to content

开发环境配置

系统要求

  • Python 3.8+
  • Node.js 16+
  • MySQL 8.0+
  • Redis 6.0+
  • Git

前端环境配置

1. 安装 Node.js

访问 Node.js 官网 下载并安装 LTS 版本。

2. 安装项目依赖

# 进入前端项目目录
cd frontend

# 安装依赖
npm install

3. 配置环境变量

创建 .env 文件:

VITE_API_BASE_URL=http://localhost:5000/api
VITE_APP_TITLE=Blog-Vue-Flask

4. 启动开发服务器

npm run dev

后端环境配置

1. 创建虚拟环境

# 创建虚拟环境
python -m venv venv

# 激活虚拟环境
# Windows
venv\Scripts\activate
# Linux/Mac
source venv/bin/activate

2. 安装依赖

# 进入后端项目目录
cd backend

# 安装依赖
pip install -r requirements.txt

3. 配置环境变量

创建 .env 文件:

FLASK_APP=app
FLASK_ENV=development
DATABASE_URL=mysql://user:password@localhost/blog
REDIS_URL=redis://localhost:6379/0
JWT_SECRET_KEY=your-secret-key

4. 初始化数据库

# 创建数据库
mysql -u root -p
CREATE DATABASE blog CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

# 初始化数据库
flask db upgrade

5. 启动开发服务器

flask run

Redis 配置

1. 安装 Redis

  • Windows: 使用 WSL 或 Docker
  • Linux: sudo apt install redis-server
  • Mac: brew install redis

2. 启动 Redis

# Windows
redis-server

# Linux/Mac
sudo service redis-server start

开发工具配置

1. VS Code 配置

安装以下扩展: - Vetur - Python - ESLint - Prettier - GitLens

2. 浏览器扩展

  • Vue.js devtools
  • Redux DevTools

开发规范

1. 代码风格

  • 前端:ESLint + Prettier
  • 后端:Black + Flake8

2. Git 提交规范

# 提交格式
<type>(<scope>): <subject>

# 类型
feat: 新功能
fix: 修复
docs: 文档
style: 格式
refactor: 重构
test: 测试
chore: 构建

3. 分支管理

  • main: 主分支
  • develop: 开发分支
  • feature/*: 功能分支
  • bugfix/*: 修复分支
  • release/*: 发布分支

常见问题

1. 端口占用

# Windows
netstat -ano | findstr :3000
# Linux/Mac
lsof -i :3000

2. MySQL 服务未启动

# Windows
net start mysql
# Linux
sudo systemctl start mysql
# Mac
brew services start mysql

3. Redis 服务未启动

# Windows
# 通过 WSL 或 Docker 启动
# Linux
sudo systemctl start redis-server
# Mac
brew services start redis