最近有一个项目需要前后端分离。实际上，简单的部署nginx和vue就可以实现了。但是考虑到项目中的管理员端和用户端分别用两套vue实现，因此考虑用docker进行部署。主要有两个好处，一是docker部署使得封装性更好，之后的拓展、拷贝、卸载也更加方便；二是可以实现多个nginx部署，不会形成冲突。
Nginx部署
首先使用下面的命令拉取nginx的镜像。
docker pull nginx 然后就是使用这个镜像创建容器（这个容器是临时的）：
docker run --name nginx -d -p 8080:80 nginx 容器创建好了以后，把nginx容器的配置文件夹拷贝到当前目录下，主要是为了获取nginx的配置文件，如果你已经有了，可以忽视这一步骤：
docker container cp nginx:/etc/nginx . 把这个文件夹改一下名字，改为conf：
mv nginx conf 把这个conf文件夹移动到你想要挂载nginx配置的地方，这个文件夹需要你自己创建：
mv conf /opt/nginx 再在 /opt/nginx（指定的）目录下，再创建html、logs文件夹
mkdir /opt/nginx/html /opt/nginx/logs 接下来就查看原容器id:
docker ps 终止容器:
docker stop id 并删除原容器：
docker rm id 如果只是创建nginx的话，直接执行下面这一步就可以了，如果还需要部署vue，则不要执行！！！不然还得删掉，再重新执行下面的步骤。
docker run --name nginx01 -p 8080:80 -v /opt/nginx/html:/usr/share/nginx/html -v /opt/nginx/logs:/var/log/nginx -v /opt/nginx/conf:/etc/nginx -d nginx 同时，/opt/nginx下的几个文件夹已经映射到docker中nginx的相应目录中了，更改里面的内容也可以相应的改变nginx的配置。
Vue部署
如果还需要部署vue，还需要进行几个步骤，首先确保vue框架已经被打包成dist文件夹了，我们接下来的步骤是将dist部署到docker的nginx中。
将dist放到opt/nginx中，和上面的几个文件夹处于同一层级，再执行下面这一步骤
sudo docker run --name nginx01 -p 8080:80 -v /opt/nginx/html:/usr/share/nginx/html -v /opt/nginx/logs:/var/log/nginx -v /opt/nginx/conf:/etc/nginx -v /opt/nginx/dist:/opt/dist -d nginx 接下来，修改opt/nginx/conf/nginx.conf文件：
user nginx; worker_processes auto; 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"'; access_log /var/log/nginx/access.log main; sendfile on; keepalive_timeout 65; gzip on; gzip_static on; gzip_buffers 4 16k; gzip_comp_level 5; gzip_types text/plain application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png; server{ listen 80; server_name _; location / { root /opt/dist; index index.html; } location /api{ proxy_pass http://41.139.212.118:80; } } include /etc/nginx/conf.d/*.conf; } 之后进入容器中
docker exec -it nginx01 /bin/bash 重启nginx
nginx -t nginx -s reload exit 如果需要部署多个nginx和vue，可以把上述步骤再重复执行，同时记得端口名要改一下
原文链接：https://blog.csdn.net/qq_35498696/article/details/124484135?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522171836884016800180645872%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=171836884016800180645872&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~times_rank-11-124484135-null-null.nonecase&utm_term=docker%E9%83%A8%E7%BD%B2
