项目是 Vue CLI正式部署不要用 npm run serve那个只是开发环境。生产环境要用npm run build1. 在前端项目构建在你的电脑或服务器上进入前端目录cd G:\work\ai\vigil\vigil-ops-console npm install npm run build构建完成后会生成vigil-ops-console/dist这个 dist 就是要部署到服务器的前端静态文件。2. 上传 dist 到 CentOS 7建议放到/opt/vigil/vigil-ops-console服务器上创建目录mkdir -p /opt/vigil/vigil-ops-console把本地 dist 目录里的内容上传进去。最终结构类似/opt/vigil/vigil-ops-console/index.html/opt/vigil/vigil-ops-console/css/opt/vigil/vigil-ops-console/js注意是上传 dist 里面的内容不是把整个 dist 文件夹套进去也行但 Nginx 配置要对应。3. 安装 NginxCentOS 7 上yum install -y epel-release yum install -y nginx启动并设置开机自启systemctl start nginx systemctl enable nginx4. 配置 Nginx新建配置文件vi vigil.conf写入server { listen 5678; server_name _; root /home/web/vigil; index index.html; location / { try_files $uri $uri/ /index.html; } location /api/ { proxy_pass http://127.0.0.1:5677/api/; proxy_http_version 1.1; 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; } }如果后端不在同一台服务器把这里改成后端服务器 IPproxy_pass http://后端服务器IP:5677/api/;在nginx的配置文件中http{}加载该配置如下图include vigil.conf;5. 检查并重启 Nginxnginx -t systemctl reload nginx然后浏览器访问http://服务器IP:56786. 防火墙放行如果服务器开了防火墙firewall-cmd --permanent --add-port5678/tcp firewall-cmd --reload