当前位置：首页 > news >正文

数字化工厂中央控制室驾驶舱系统 - Windows 部署笔记

news 来源：原创 2025/5/6 6:22:29

数字化工厂中央控制室驾驶舱系统 - Windows 部署笔记

环境准备

这篇笔记记录了我在 Windows 10/11 上部署数字化工厂中央控制室驾驶舱系统的全过程，包括各种常见问题的解决方法。部署过程中使用了国内镜像源来加快下载速度。

前置需求

Python：3.8 到 3.11 版本（我用的是 3.11.4）
Node.js：v16 LTS 或 v18 LTS（我用的是 v18.19.0）
VSCode：代码编辑和终端使用

步骤一：系统解压与目录设置

将 DigitalFactoryDashboard.zip 解压到合适的路径
```
例如：C:\Projects\DigitalFactoryDashboard
```
打开 VSCode，选择 “File” > “Open Folder”，选择解压出来的 DigitalFactoryDashboard 文件夹

步骤二：后端环境配置

打开 VSCode 中的终端（快捷键：Ctrl + `）
进入后端目录
```
cd DigitalFactoryDashboard/backend
```
创建并激活 Python 虚拟环境（推荐，但不强制）
```
python -m venv venv
# 激活虚拟环境
venv\Scripts\activate
```
激活后你会看到终端提示符前面多了 (venv)，表示已进入虚拟环境。

使用清华源配置 pip（加速依赖下载）

pip config set global.index-url https://pypi.tuna.tsinghua.edu.cn/simple

安装后端依赖

pip install -r requirements.txt

可能出现的问题和解决方法：

问题1：找不到某些包

ERROR: Could not find a version that satisfies the requirement...

解决方法：尝试单独安装关键包

pip install fastapi==0.103.1 uvicorn==0.23.2 sqlalchemy==2.0.20 pandas==2.1.0 python-socketio==5.8.0

问题2：下载超时

ReadTimeoutError: HTTPSConnectionPool(host='pypi.org'...

解决方法：增加超时时间重试

pip install -r requirements.txt --timeout 300

问题3：依赖冲突
解决方法：创建新的虚拟环境，确保干净的安装环境

deactivate  # 如果在虚拟环境中
rd /s /q venv  # 删除旧虚拟环境
python -m venv venv  # 创建新虚拟环境
venv\Scripts\activate
pip install -r requirements.txt

步骤三：前端环境配置

打开一个新的 VSCode 终端，进入前端目录
```
cd DigitalFactoryDashboard/frontend
```

配置 npm 使用淘宝镜像源（加速依赖下载）

npm config set registry https://registry.npmmirror.com

安装前端依赖
```
npm install
```
可能出现的问题和解决方法：
- 问题1：node_modules 损坏或依赖冲突
```
Error: Cannot find module 'xxx'
```
  解决方法：清除缓存并重新安装
```
# 删除 node_modules 和 lock 文件
rmdir /s /q node_modules
del package-lock.json# 清理 npm 缓存
npm cache clean --force# 重新安装
npm install
```
- 问题2：tapable 模块丢失
```
Error: Cannot find module 'C:\...\node_modules\tapable\lib\index.js'
```
  解决方法：单独安装 tapable 模块
```
npm install tapable
```
  然后重新安装所有依赖
```
npm install
```
- 问题3：Node.js 版本不兼容
  解决方法：使用 Node.js v16 LTS 或 v18 LTS 版本，避免使用 v17 或最新的 v20 版本，因为有些依赖可能尚未兼容
- 问题4：Yarn 替代方案
  如果 npm 安装反复出错，可以尝试 Yarn：
```
npm install -g yarn
yarn
```

步骤四：启动后端服务

在 VSCode 终端中，确保你在后端目录，并且虚拟环境已激活

cd DigitalFactoryDashboard/backend
venv\Scripts\activate  # 如果还没有激活虚拟环境

启动后端服务

python run.py

成功启动后，你会看到类似以下输出：

INFO:     Started server process [12345]
INFO:     Waiting for application startup.
INFO:     Application startup complete.
INFO:     Uvicorn running on http://0.0.0.0:8000 (Press CTRL+C to quit)

注意：保持这个终端窗口运行，不要关闭它。

可能出现的问题和解决方法：

问题1：端口冲突

ERROR: [Errno 10013] Permission denied

解决方法：可能是端口 8000 被占用，修改 run.py 文件中的端口号

# 约在文件末尾找到这行
uvicorn.run(app, host="0.0.0.0", port=8000)# 改为其他端口，例如
uvicorn.run(app, host="0.0.0.0", port=8001)

问题2：模块引入错误
```
ModuleNotFoundError: No module named 'xxx'
```
解决方法：检查是否忘记安装某些依赖，或者尝试单独安装缺失模块
```
pip install 模块名
```

步骤五：启动前端服务

在 VSCode 中打开新终端，进入前端目录
```
cd DigitalFactoryDashboard/frontend
```
启动前端开发服务器
```
npm start
```
成功启动后，浏览器会自动打开 http://localhost:3000，展示应用界面。

可能出现的问题和解决方法：
- 问题1：与后端连接失败
  如果前端无法连接到后端服务，检查 package.json 文件中的 proxy 设置：
```
"proxy": "http://localhost:8000"
```
  确保这里的端口号与后端运行的端口一致。
- 问题2：JavaScript 堆内存不足
```
FATAL ERROR: Reached heap limit
```
  解决方法：增加 Node.js 内存限制
```
set NODE_OPTIONS=--max_old_space_size=4096
npm start
```
- 问题3：缺少浏览器兼容性文件
```
Error: Cannot find module 'browserslist'
```
  解决方法：
```
npx browserslist@latest --update-db
```

性能优化建议

降低 3D 和动画密度：如果系统运行缓慢，可在 src/components/charts/ 目录下相关文件中调整参数
关闭 ESLint 警告：如果开发阶段遇到大量 ESLint 警告，可以在 .eslintrc.js 添加规则：
```
rules: {'no-unused-vars': 'off','react-hooks/exhaustive-deps': 'off'
}
```

使用生产构建：实际部署环境使用生产构建而非开发服务器

cd frontend
npm run build
# 然后使用 serve 或其他静态文件服务器
npx serve -s build

测试系统

前后端都启动后，访问 http://localhost:3000，你应该能看到系统仪表盘。测试以下功能确认系统正常工作：

实时数据刷新
设备状态监控
生产线效率图表
报警信息显示

常见问题总结

前后端无法连接
- 检查后端是否正常运行在 http://localhost:8000
- 检查前端 package.json 中 proxy 设置是否正确
- 检查Windows防火墙是否阻止了通信
页面加载速度慢
- 检查网络连接
- 可能是首次加载资源较多，刷新后应该会加快
- 尝试减少 3D 模型和动画效果
数据不更新
- 检查后端控制台是否有错误信息
- 可能是 WebSocket 连接失败，检查网络设置
打包和部署问题
- 生产环境部署时，如需修改后端地址，须在前端构建前修改 .env 文件