Linux部署vue项目

打包

npm run build

部署

• 将打包出来的资源，基于Vue-Cli的一般是dist目录下有static目录和index.html文件，可以直接将这两个文件扔到服务端

• 但有时候，我们会直接将dist文件扔到服务端

使用nginx代理部署vue项目

找到nginx的配置文件 nginx.conf 。

http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    server {
        listen       80;
        server_name  localhost;

        location / {
                root   /home/ruoyi-ui/dist;
                try_files $uri $uri/ /index.html;
                index  index.html index.htm;
        }

        location /prod-api/{
                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:8080/;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

参数说明：

• root /home/ruoyi-ui/dist; // 路径配置为项目所在的dist文件绝对地址

• proxy_pass http://127.0.0.1:9080;#转发请求的地址;设置被代理服务器的端口或套接字，以及URL

• proxy_connect_timeout 90; // 后端服务器连接的超时时间_发起握手等候响应超时时间

• proxy_read_timeout 180;//连接成功后_等候后端服务器响应时间_其实已经进入后端的排队之中等候处理（也可以说是后端服务器处理请求的时间）

• proxy_send_timeout 180;//后端服务器数据回传时间_就是在规定时间之内后端服务器必须传完所有的数据

• proxy_buffer_size 256k;//设置从被代理服务器读取的第一部分应答的缓冲区大小，通常情况下这部分应答中包含一个小的应答头，默认情况下这个值的大小为指令proxy_buffers中指定的一个缓冲区的大小，不过可以将其设置为更小

• proxy_buffers 4 256k;//设置用于读取应答（来自被代理服务器）的缓冲区数目和大小，默认情况也为分页大小，根据操作系统的不同可能是4k或者8k