前端dist包使用docker打包部署

1.前端包使用docker部署所需文件

》dist前台包

》Dockerfile 文件

》nginx.conf 文件

2.Dockerfile文件

From nginx:1.22

COPY dist /home/data/fronted/dist

COPY nginx.conf /etc/nginx/nginx.conf

COPY nginx.conf /etc/nginx/conf.d/default.conf

3.nginx.conf文件

user  root;
worker_processes  10;

#error_log  /var/log/nginx/error.log notice;
#pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';
    #请求体最大10G
    client_max_body_size 10240M;
    #access_log  /var/log/nginx/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    underscores_in_headers on;

    keepalive_timeout  65000;

    #gzip  on;

    server {
        listen       80;
        listen  [::]:80;
        server_name  localhost;


        location / {
            alias   /home/data/fronted/dist/;
            index  index.html;
            client_max_body_size 10000m;
            proxy_read_timeout 600s;
            proxy_send_timeout 600s;
            proxy_connect_timeout 600s;
            try_files $uri $uri/ /index.html;
            charset utf-8;
            #配置跨域
            add_header Access-Control-Allow-Origin *;
            add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
            add_header Access-Control-Allow-Headers Content-Type,Authorization;
        }
        
        location /prod-api/ {
            proxy_pass http://common-gateway:80/;
            proxy_pass_request_headers on;
            proxy_read_timeout 300s;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }



        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   /usr/share/nginx/html;
        }

    }

}

4.docker命令

docker build -t fronted:版本号(一般为日期) .
docker save -o fronted-版本号.tar fronted:版本号(一般为日期)

5.文件目录