Python Web 框架 django-vue3-admin快速入门 django后台管理

0. 介绍

django-vue3-admin是一个基于Django4 + DRF +Vue 3 的前后端分离快速开发框架。内置权限管理、认证管理等功能,适合基于此开源项目快速开发各种类型的后台管理系统。

1. 准备工作

1.1 准备开发环境

如果已准备好开发环境,直接跳到下一章节"项目安装部署"。

  • Python 推荐版本 3.9
  • MySQL 推荐版本 8.0
  • nodejs 推荐版本 18.20.4(LTS)
  • (可选)Redis 如果在Windows上开发,推荐版本 5
  • 开发工具 推荐 VSCode

------下面以Windows 10操作系统为示例,搭建开发环境。

1.2 Windows 10 安装Python 3.9.13

Python下载地址

1.3 Windows 10 安装MySQL 8.0.39

MySQL下载地址

MySQL安装教程

1.4 Windows 10 安装Node.js 18.20.4

Node.js下载地址

1.5 Windows 10安装 Redis 5.0.14.1

Redis下载地址

1.6 Windows 10安装VSCode

VSCode下载地址

2. 项目安装部署

2.1 下载源码

下载master分支

复制代码
git clone https://gitee.com/huge-dream/django-vue3-admin.git

(可选)下载使用develop分支命令示例,develop分支bug较多:

复制代码
git clone https://gitee.com/huge-dream/django-vue3-admin.git -b develop

2.2 配置后端

进入目录django-vue3-admin\backend\conf,复制env.example.py文件,重命名为env.py。按需修改配置。

  • 数据库配置:如果使用MySQL 8.0 数据库,填写实际的地址、端口、用户名和密码。
  • Redis配置:如果使用Redis 5 或以上,填写实际的地址、密码。

2.3 启动后端

进入目录django-vue3-admin\backend,安装依赖库

复制代码
pip install -r requirements.txt

如果使用MySQL数据库,手动创建数据库django-vue3-admin。(如果使用SQLite数据库,请忽略)

复制代码
数据库名称:django-vue3-admin
字符集:utf8mb4
排序规则:utf8mb4_general_ci

执行数据库迁移

复制代码
python manage.py makemigrations
python manage.py migrate

初始化数据:向数据库写入初始化数据

复制代码
python3 manage.py init

初始化省市县数据

复制代码
python3 manage.py init_area

启动后端

复制代码
python manage.py runserver 0.0.0.0:8000

访问后端:打开浏览器,输出后端IP地址和端口。例如:http://127.0.0.0:8000/

如果启动成功,能看到Swagger的API界面。

2.4 配置前端

进入目录django-vue3-admin\web,开发环境配置文件.env.development,用于开发时使用。

复制代码
# 本地环境
ENV = 'development'

# 本地环境接口地址
VITE_API_URL = 'http://127.0.0.1:8000'

# 是否启用按钮权限
VITE_PM_ENABLED = true

进入目录django-vue3-admin\web,生产环境配置文件.env.production,用于生产部署时使用。

复制代码
# 线上环境
ENV = 'production'

# 线上环境接口地址
VITE_API_URL = '/api' # docker-compose部署不需要修改,nginx容器自动代理了这个地址

# 是否启用按钮权限
VITE_PM_ENABLED = true

2.5 启动前端

进入目录django-vue3-admin\web,安装依赖

复制代码
npm install --registry=https://registry.npm.taobao.org
或
npm install

启动前端

复制代码
npm run dev

访问前端:打开浏览器,输入前端IP地址和默认端口8080。示例:http://127.0.0.0:8080/。

默认账号:superadmin 密码:admin123456

如果能登录成功,说明后端和前端都启动正常。

3. 排错指南

3.1 Unknown database错误

执行命令python manage.py makemigrations,出现错误Unknown database 'django-vue3-admin'

错误描述

复制代码
PS E:\python_workspace\django\dvadmin\django-vue3-admin\backend> python .\manage.py makemigrations
请先进行数据库迁移!
请先进行数据库迁移!
E:\python_workspace\django\dvadmin\venv\lib\site-packages\django\core\management\commands\makemigrations.py:158: RuntimeWarning: Got an error checking a consistent migration history performed for database connection 'default': (1049, "Unknown database 'django-vue3-admin'")
  warnings.warn(

解决方法:先手动创建django-vue3-admin数据库,再执行该命令。

3.2 MySQLdb.OperationalError错误

执行命令python manage.py migrate,出现错误MySQLdb.OperationalError: (1049, "Unknown database 'django-vue3-admin'")

错误描述

复制代码
E:\python_workspace\django\dvadmin\django-vue3-admin\backend> python .\manage.py migrate
Traceback (most recent call last):
  File "E:\python_workspace\django\dvadmin\venv\lib\site-packages\django\db\backends\base\base.py", line 289, in ensure_connection
    self.connect()
  File "E:\python_workspace\django\dvadmin\venv\lib\site-packages\django\utils\asyncio.py", line 26, in inner
    return func(*args, **kwargs)
  File "E:\python_workspace\django\dvadmin\venv\lib\site-packages\django\db\backends\base\base.py", line 270, in connect        
    self.connection = self.get_new_connection(conn_params)
  File "E:\python_workspace\django\dvadmin\venv\lib\site-packages\django\utils\asyncio.py", line 26, in inner
    return func(*args, **kwargs)
  File "E:\python_workspace\django\dvadmin\venv\lib\site-packages\django\db\backends\mysql\base.py", line 247, in get_new_connection
    connection = Database.connect(**conn_params)
  File "E:\python_workspace\django\dvadmin\venv\lib\site-packages\MySQLdb\__init__.py", line 121, in Connect
    return Connection(*args, **kwargs)
  File "E:\python_workspace\django\dvadmin\venv\lib\site-packages\MySQLdb\connections.py", line 193, in __init__
    super().__init__(*args, **kwargs2)
MySQLdb.OperationalError: (1049, "Unknown database 'django-vue3-admin'")

解决方法:先在MySQL手动创建django-vue3-admin数据库,再执行该命令。

3.3 Failed to build installable wheels for some pyproject.toml based projects (mysqlclient)

报错信息如下:

复制代码
FEST
      LINK : fatal error LNK1181: 无法打开输入文件"mariadbclient.lib"
      error: command 'C:\\Program Files (x86)\\Microsoft Visual Studio\\2017\\BuildTools\\VC\\Tools\\MSVC\\14.16.27023\\bin\\HostX86\\x64\\link.exe' failed with exit code 1181
      [end of output]

  note: This error originates from a subprocess, and is likely not a problem with pip.
  ERROR: Failed building wheel for mysqlclient
Failed to build mysqlclient
ERROR: Failed to build installable wheels for some pyproject.toml based projects (mysqlclient)

解决方法:

可将mysqlclient==2.2.0替换为pymysql==1.0.2(当前最新稳定版)或更高兼容版本(如pymysql>=1.0.2)‌14。


‌操作步骤‌

  1. ‌修改requirements.txt文件 ‌:

    - mysqlclient==2.2.0 + pymysql>=1.0.2

  2. 使用 PyMySQL

    pip uninstall mysqlclient -y
    pip install pymysql==1.1.0

3.在 settings.py 中添加以下代码:

复制代码
import pymysql
pymysql.install_as_MySQLdb()  # 模拟 mysqlclient 的 API

3.4 Typerror: crypto$2.getRandomValues is not a function 错误

解决方法:切换node版本,从16切换到18

4. 参考资料

相关推荐
程序员海军21 小时前
用了两年多 GPT,我最近开始换模型了,还折腾了个求职避坑 Agent
前端·人工智能·后端
zttbee1 天前
echarts图表tooltip色块失效
前端·javascript·echarts
excel1 天前
IndexNow:让搜索引擎更快发现网站更新的主动通知协议
前端·后端·架构
子兮曰1 天前
CSS 复现 23 种设计风格:从拟物到液态玻璃的成本阶梯与兜底写法【实战】
前端·css·视觉设计
虚无境1 天前
如何用AI帮我写出实用的插件
前端·javascript·ai编程
外收内放1 天前
面向对象高级(实战案例)
开发语言·python·学习
柳杉1 天前
从数字化到数智化:3D 可视化大屏的下一个五年
前端·ai编程·数据可视化
专业程序开发源1 天前
springboot欧缇蔓月子中心管理系统82697-计算机课程设计、毕业设计
java·spring boot·后端·python·spring·django·课程设计
FPGA小迷弟1 天前
用 Claude Code 重构遗留系统:从评估到落地的完整实践指南
c++·python·ai·plotly·django·ai编程·claude
卷无止境1 天前
面向arm64桌面客户端开发全景:语言、框架与生态
后端·python