看起来你已经搭好了基础的Docker环境，但502错误本质是Nginx没法成功连接到Vitepress容器，咱们一步步排查和修复这个问题：

1. 修正Nginx反向代理配置 #

首先确保Nginx的local.conf里的代理地址是正确的——Vitepress容器的服务名是vitepress，暴露的端口是9000，所以配置要这样写（注意WebSocket相关的头，Vitepress开发模式需要热更新，必须加这些）：

location /docs/ {
    proxy_pass http://vitepress:9000/;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_cache_bypass $http_upgrade;
}

之前你试过写http://vitepress:5173/，这明显不对，5173是主Vite应用的端口，Vitepress用的是9000，这是导致502的核心原因之一。

2. 调整Vitepress的监听配置 #

Vitepress默认只监听127.0.0.1，这在Docker容器里会导致外部（比如Nginx）无法访问。你需要修改package.json里的启动脚本，让它监听容器的所有IP：

"docs:dev": "vitepress dev docs --port=9000 --base=/docs/ --host=0.0.0.0"

加上--host=0.0.0.0后，Vitepress会响应来自容器外部的请求，Nginx才能顺利连接。

3. 优化Docker Compose配置 #

你不需要把Vitepress的9000端口暴露给主机（因为是通过Nginx反向代理访问），反而暴露端口可能导致不必要的冲突。修改docker-compose.yml里的vitepress服务，去掉ports配置：

vitepress:
  build:
    context: ../.
    dockerfile: ./docker/vitepress/Dockerfile
  # 移除下面的端口映射，容器内部通过服务名访问即可
  # ports:
  #   - '9000:9000'
  volumes:
    - '..:/var/www/html:delegated'
    - 'trinity-ui-vite-mnt:/var/run'
  networks:
    trinity-ui-vite-bridge:
      aliases:
        - trinity-ui-vite.local

好在所有服务都在同一个trinity-ui-vite-bridge网络里，Nginx可以直接通过服务名vitepress访问到Vitepress容器。

4. 验证容器连通性（可选但有用） #

如果还是有问题，可以进入Nginx容器测试和Vitepress的连通性：

# 进入Nginx容器（替换成你的容器名）
docker exec -it tuiv_nginx_1 /bin/bash
# 测试能否访问Vitepress
curl http://vitepress:9000/docs/

如果curl能返回HTML内容，说明网络没问题；如果返回连接拒绝，那大概率是Vitepress没正确启动或者监听地址不对。

5. 重启所有容器 #

最后，重启所有容器让配置生效：

docker-compose -p tuiv down
docker-compose -p tuiv up --build -d

做完这些步骤后，你应该就能通过https://localhost:5173/docs/访问到Vitepress文档了。

备注：内容来源于stack exchange，提问作者Artur Müller Romanov