fix: 修复 WebUI 源码缺失、环境检测路径及文档说明

- 调整 .gitignore,避免误忽略 webui/src/lib/ 和 webui/src/components/env/
- 补齐 WebUI 缺失的 lib 工具函数、API 封装及环境检测组件
- 修复 /api/env/check 使用相对路径导致启动目录不同时检测失败的问题
- 更新中/英/西三语 README 的 WebUI 开发调试与生产构建说明
This commit is contained in:
程序员阿江(Relakkes)
2026-07-01 23:32:10 +08:00
parent 92c98e658e
commit 076dcba978
9 changed files with 528 additions and 28 deletions

View File

@@ -175,9 +175,27 @@ uv run main.py --help
MediaCrawler 提供了基于 Web 的可视化操作界面,无需命令行也能轻松使用爬虫功能。
#### 构建前端资源(首次使用需要
#### 开发调试(推荐
WebUI 前端源码位于 `webui/` 目录,需要先构建静态资源后才能通过 API 服务器访问。
开发时需要同时启动后端 API 服务和前端 Vite 开发服务器:
```shell
# 终端 1启动 API 服务器(默认端口 8080
uv run uvicorn api.main:app --port 8080 --reload
# 终端 2启动前端开发服务器
cd webui
npm install
npm run dev # 默认在 5173 端口启动,并代理 /api 到 8080
```
启动成功后,访问 `http://localhost:5173/` 即可打开 WebUI 界面。
> 首次打开会进行环境检测(调用 `/api/env/check`),请确保后端服务已启动。如果检测失败,可点击「跳过检测」临时跳过。
#### 构建生产资源
如果希望通过 API 服务器直接提供 WebUI 静态资源,需要先构建前端:
```shell
cd webui
@@ -185,19 +203,13 @@ npm install
npm run build # 产物输出到 api/webui/
```
> 开发调试可改用 `npm run dev`,会在 5173 端口启动 Vite 开发服务器并自动代理 `/api` 到 8080。
#### 启动 WebUI 服务
构建完成后,只需启动 API 服务器:
```shell
# 启动 API 服务器(默认端口 8080
uv run uvicorn api.main:app --port 8080 --reload
# 或者使用模块方式启动
uv run python -m api.main
```
启动成功后,访问 `http://localhost:8080` 即可打开 WebUI 界面
然后访问 `http://localhost:8080` 即可。
#### WebUI 功能特性