本例子使用的是官网演示地址的部署，具体操作如下

我们以官网例子说明，后端webman运行的是8787端口，前端域名采用的是 admin.saithink.top

前端saiadmin-vue配置：

# .env.production
VITE_APP_ENV = production

VITE_APP_BASE_URL = http://admin.saithink.top
VITE_APP_WS_URL = ws://127.0.0.1:9527
VITE_APP_PROXY_PREFIX = /prod

注意: VITE_APP_WS_URL的IP设置为服务器的IP 然后进行文件打包

yarn build

将生成的文件拷贝到webman的public目录下，这样文件就准备好了

服务器配置：

服务上将webman运行起来，本例子中使用的是8787端口，webman的运行具体参考官网

在服务器上新建一个网址，域名是：admin.saithink.top，然后指向的目录就是webman/public目录

nginx配置如下, 主要增加了一个代理

server
{
    listen 80;
    server_name admin.saithink.top;
    index index.php index.html index.htm default.php default.htm default.html;
    root /www/wwwroot/webman/public;
    
    location /prod/ {
			proxy_set_header Host $http_host;
			proxy_set_header X-Real-IP $remote_addr;
			proxy_set_header REMOTE-HOST $remote_addr;
			proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
			proxy_pass http://localhost:8787/;
		}

    

主要就是location /prod/ 这块区域的代码，做了一个代理转发，将请求转发到webman的8787端口，这样就实现了前端和后端的分离