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下载地址https://i-blog.csdnimg.cn/direct/8f35cc4548184212ae789c451fde6d20.png
1.3 Windows 10 安装MySQL 8.0.39
MySQL下载地址https://i-blog.csdnimg.cn/direct/221f14c8e14d45518f07cd8ce1a7ea0b.png
MySQL安装教程
1.4 Windows 10 安装Node.js 18.20.4
Node.js下载地址https://i-blog.csdnimg.cn/direct/0414bdf3609842358c04124d744938c7.png
1.5 Windows 10安装 Redis 5.0.14.1
Redis下载地址https://i-blog.csdnimg.cn/direct/8b198ac8f8c24009844b31bf8a8979b1.png
1.6 Windows 10安装VSCode
VSCode下载地址https://i-blog.csdnimg.cn/direct/a41d338112ba424baa3d2b4dceb9fc49.png
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界面。https://i-blog.csdnimg.cn/direct/bc7f70101fa646209e15976ddd208d2a.png
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/。https://i-blog.csdnimg.cn/direct/502efbb42f5c4871ba908eb73a881f46.png
默认账号：superadmin 暗码：admin123456
如果能登录成功，说明后端和前端都启动正常。https://i-blog.csdnimg.cn/direct/e47a5e012e004f2796a80fb17c559237.png
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
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。
操作步调
[*]修改requirements.txt文件： - mysqlclient==2.2.0 + pymysql>=1.0.2
[*] 利用 PyMySQL
pip uninstall mysqlclient -y
pip install pymysql==1.1.0 3.在 settings.py 中添加以下代码：
import pymysql
pymysql.install_as_MySQLdb()# 模拟 mysqlclient 的 API
https://i-blog.csdnimg.cn/direct/321230d4622640f4b017f78d16e79bba.png
3.4 Typerror: crypto$2.getRandomValues is not a function 错误
https://i-blog.csdnimg.cn/direct/1395d36e36724c06ac257641214d327d.png
解决方法：切换node版本，从16切换到18
https://i-blog.csdnimg.cn/direct/6bef5f96daef47d7929ed88a88ab8a8b.png
4. 参考资料
[*]Django-vue3-admin源码
[*]Django 4.2官方文档
[*]Django-vue3-admin文档
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]