当前位置：首页 > news >正文

nginx部署多个 vue项目

news 来源：原创 2024/9/23 5:21:29

第一步

将vue打包项目上传到服务器如下图

第二步

配置nginx分2个端口配置

server
    {
        listen 8080;
        server_name    你的域名;
        index index.html index.htm index.php;
         root /www/wwwroot/dist/;
     
         #error_page   404   /404.html;
        include enable-php.conf;
        
        
  location /web {   
           alias  /www/wwwroot/dist/;
            try_files $uri $uri/ /index.html;     
            }
        
        
        
        
       
        
        
 location   /api{
            proxy_pass  你的域名:3000;
            add_header Content-Type "text/plain;charset=utf-8";
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Credentials' 'true';
            add_header 'Access-Control-Allow-Methods' 'GET, POST';
        }
        
         
        
        
        
        location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
        {
            expires      30d;
        }

        location ~ .*\.(js|css)?$
        {
            expires      12h;
        }

        location ~ /\.
        {
            deny all;
        }

        access_log  /www/wwwlogs/access.log;
    }
    
    
    
    
    
    server
    {
        listen 8081;
        server_name   你的域名;
        index index.html index.htm index.php;
         root /www/wwwroot/tasks/;
     
         #error_page   404   /404.html;
        include enable-php.conf;
        
        
  location /app {   
           alias  /www/wwwroot/tasks/;
            try_files $uri $uri/ /index.html;     
            }
        
        
        
        
       
        
        
 location   /api{
            proxy_pass  你的域名:8000;
            add_header Content-Type "text/plain;charset=utf-8";
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Credentials' 'true';
            add_header 'Access-Control-Allow-Methods' 'GET, POST';
        }
        
         
        
        
        
        location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
        {
            expires      30d;
        }

        location ~ .*\.(js|css)?$
        {
            expires      12h;
        }

        location ~ /\.
        {
            deny all;
        }

        access_log  /www/wwwlogs/access.log;
    }
    
    
    
    
    
    
include /www/server/panel/vhost/nginx/*.conf;
}