Docker部署Vue 工程包

docker部署 Vue 工程包

目录结构

[root@host ~]# tree front/
front/
├── dist.conf
├── dist.zip
├── Dockerfile
└── nginx.conf

编写Dockerfile

这里的基础镜像是我优化过的，大家可以指定官方的

FROM nginx:1.13
MAINTAINER test
COPY dist.conf /etc/nginx/conf.d/dist.conf
COPY nginx.conf /etc/nginx/nginx.conf
RUN rm  /etc/nginx/conf.d/default.conf -rf
COPY *.zip /home/

编写代理文件

这里的 /upload/ 是代理的图片路径

server {
        listen  9528;
        server_name  localhost;

        location / {
                root   /home/public;
                index  index.html index.htm;
        }
       location /upload/ {
                root  /home;
        }

编写nginx.conf

# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/

user  nginx;
worker_processes  auto;
worker_rlimit_nofile 65535; 

error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;

# Load dynamic modules. See /usr/share/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
	worker_connections  2048;
}

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"';

	access_log  /var/log/nginx/access.log  main;

	sendfile            on;
	tcp_nopush          on;
	tcp_nodelay         on;
	types_hash_max_size  2048;

	keepalive_timeout   60;
	proxy_connect_timeout 3s;
	proxy_read_timeout    10s;
	proxy_send_timeout    10s;

	server_names_hash_bucket_size 128;
	client_header_buffer_size 128k;
	client_max_body_size 1024m;
	large_client_header_buffers 4 128k;

	proxy_buffering on;
	proxy_buffer_size 4k;
	proxy_buffers 8 1m;
	proxy_busy_buffers_size 2m;
	proxy_temp_file_write_size 2m;

	add_header X-Frame-Options "SAMEORIGIN";

	include /etc/nginx/conf.d/*.conf;
}

build 镜像

[root@host ~]# docker build -t dist:v0.1 front/
ending build context to Docker daemon  2.75 MB
Step 1 : FROM nginx:1.13
 ---> d044548b1076
Step 2 : MAINTAINER test
 ---> Running in a4f82d1f813d
 ---> 11891ec35400
Removing intermediate container a4f82d1f813d
Step 3 : COPY dist.conf /etc/nginx/conf.d/dist.conf
 ---> 042ebd62c9da
Removing intermediate container 8bb11197bb6e
Step 4 : COPY nginx.conf /etc/nginx/nginx.conf
 ---> 70084e83232b
Removing intermediate container fb986e1b38cb
Step 5 : RUN rm  /etc/nginx/conf.d/default.conf -rf
 ---> Running in 84369459ea97
 ---> fa4f7acafa7b
Removing intermediate container 84369459ea97
Step 6 : COPY *.zip /home/
 ---> c8e3f0f60c6e
Removing intermediate container 011f626e50b3
Successfully built c8e3f0f60c6e

结语

这样前端工程镜像就build好了，可以执行docker run -d -p9528:9528 dist:v0.1启动