一站式零基础全栈框架：Django+Vue管理系统开发指南

django-vue-admin是一个基于前后端分离架构的管理系统开发平台，后端采用Django+Django REST Framework，前端使用Vue+ElementUI，移动端支持uniapp+uView。无需复杂配置，即可快速构建功能完善的企业级管理界面。

项目概览：全栈开发新体验

项目采用模块化设计，分为前端（client）、移动端（client_mp）和后端（server）三大核心模块。这种结构既保证了前后端完全分离，又能通过统一的接口规范实现无缝协作。

核心架构：前后端分离解析

后端服务层

• Django：提供强大的ORM和Admin后台
• Django REST Framework：构建RESTful API接口
• Celery：处理异步任务和定时任务

前端应用层

• Vue.js：构建用户界面的渐进式框架
• ElementUI：提供丰富的UI组件库
• Vuex：Vue.js的集中式状态管理模式

移动端支持

• uniapp：跨平台应用开发框架
• uView：基于Vue的移动端UI框架

3步启动：开发环境一键配置

1️⃣ 克隆项目代码

git clone https://gitcode.com/gh_mirrors/dj/django-vue-admin
cd django-vue-admin

2️⃣ 配置后端环境

cd server
pip install -r requirements.txt
python manage.py migrate
python manage.py runserver

3️⃣ 启动前端服务

cd ../client
npm install
npm run serve

5大配置模块：系统定制指南

1. 数据库配置

修改server/server/settings.py文件，配置数据库连接信息：

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'your_db_name',
        'USER': 'your_username',
        'PASSWORD': 'your_password',
        'HOST': 'localhost',
        'PORT': '3306',
    }
}

2. 用户权限配置

通过server/apps/system/models.py定义RBAC权限模型，实现细粒度的权限控制。

3. 前端路由配置

编辑client/src/router/index.js文件，配置页面路由和权限控制。

4. 静态资源配置

设置server/server/settings.py中的静态文件和媒体文件路径：

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

5. 任务调度配置

通过server/apps/system/tasks.py定义定时任务，使用Celery进行任务调度。

常见问题解决方案

问题1：跨域访问限制

解决路径：

1. 安装django-cors-headers
2. 在settings.py中添加CORS配置
3. 配置允许的源、方法和头部信息

问题2：数据库迁移失败

解决路径：

1. 删除migrations目录下除__init__.py外的文件
2. 删除db.sqlite3文件
3. 重新执行python manage.py makemigrations和python manage.py migrate

问题3：前端依赖安装失败

解决路径：

1. 清除npm缓存：npm cache clean --force
2. 更换npm源：npm config set registry https://registry.npm.taobao.org
3. 重新安装依赖：npm install

进阶拓展：功能定制与扩展

系统提供了丰富的扩展接口，可以通过以下方式进行功能定制：

• 自定义业务模块：在server/apps目录下创建新的应用
• 扩展前端组件：在client/src/components目录下添加自定义组件
• 开发API接口：通过Django REST Framework扩展API端点

项目贡献与交流

欢迎通过提交Issue和Pull Request参与项目贡献。如需帮助或交流经验，可以加入项目交流群获取支持。

项目仓库地址：https://gitcode.com/gh_mirrors/dj/django-vue-admin