Ruoyi-Vue前端部署-nginx部署多个vue前端项目

要使用Nginx部署多个Vue前端项目，你需要为每个项目配置不同的server块。以下是一个简化的Nginx配置示例，展示了如何部署两个Vue项目：

http {
    include       mime.types;
    default_type  application/octet-stream;
 
    # 日志路径
    access_log  /var/log/nginx/access.log;
    error_log   /var/log/nginx/error.log;
 
    # 服务器配置块1
    server {
        listen       80;
        server_name  project1.example.com;
 
        location / {
            root   /path/to/project1/dist;  # Vue项目1的构建输出目录
            index  index.html;
            try_files $uri $uri/ /index.html;
        }
    }
 
    # 服务器配置块2
    server {
        listen       80;
        server_name  project2.example.com;
 
        location / {
            root   /path/to/project2/dist;  # Vue项目2的构建输出目录
            index  index.html;
            try_files $uri $uri/ /index.html;
        }
    }
}

确保将server_name替换为你的域名或IP，将root指令的路径替换为你的Vue项目构建后的文件夹路径。

1. 构建你的Vue项目，通常使用npm run build。
2. 将构建好的内容放入Nginx的root指定的目录中。
3. 重启或重新加载Nginx配置。

sudo nginx -s reload

确保你的防火墙设置允许通过80端口（或你选择的端口）的流量。