將前端代碼打包成docker鏡像

說明：主要是將前端代碼文件打包到nginx容器中，制作為鏡像，再在啟動這個鏡像時就可以直接訪問到前端頁面

 

1. 目錄結構如下 

[root@dafeng data]# pwd
/data
[root@dafeng data]# ll
total 12
-rwxr-xr-x 1 root root  207 May  7 00:04 Dockerfile
-rwxr-xr-x 1 root root 2476 May  6 23:52 nginx.conf
drwxr-xr-x 6 root root 4096 May  6 11:17 si

2.修改nginx.conf文件

主要是修改了nginx的訪問路徑root

server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  _;
        root         /usr/share/nginx/sisi/dist;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

        location / {
        }

        error_page 404 /404.html;
            location = /40x.html {
        }

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

 

3.dockerfile示例

[root@dafeng data]# cat Dockerfile 
FROM nginx

RUN mkdir /usr/share/nginx/sisi

RUN mkdir /usr/share/nginx/sisi/dist

RUN rm -rf /etc/nginx/nginx.conf

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

COPY ./si  /usr/share/nginx/sisi/dist

EXPOSE 80

說明：首先在nginx容器中創建目錄，拷貝自定義修改后的nginx.conf配置文件和前端代碼文件夾si至root路徑中

 

4.構建鏡像

[root@dafeng data]# docker image build -t nginx-si-web .
# 最后的點要注意不要漏掉

 

5.運行鏡像

[root@dafeng data]# docker run --name ss --rm  -p 80:80 nginx-si-web
106.52.52.39 - - [06/May/2020:16:04:43 +0000] "GET / HTTP/1.1" 200 20047 "-" "curl/7.29.0" "-"