Docker 部署VUE项目

Docker 部署VUE项目

浅尝Docker+Nginx部署项目，涉及到的都是比较简单的操作，如有错误，请指正！谢谢！

在docker中启动vue容器时，本质上是启动了一个Nginx服务，我们要做的就是将项目构建成我们“定制”的Nginx服务镜像，再进行容器启动。

所需文件

• Dockerfile
• Nginx配置文件
• Vue项目Build后的静态文件

创建Dockerfile

Dockerfile内容：

其本质就是用来构建镜像，包含构建镜像所需的指令和说明

FROM nginx #标准的nginx镜像,我们需要基于标准的nginx镜像制作自己的镜像
MAINTAINER blogapp #设置生成镜像的Author 
COPY . /usr/share/nginx/html/ #拷贝当前目录的文件到指定文件夹下，改文件夹为镜像中的文件夹
COPY blogapp.conf /etc/nginx/nginx.conf #拷贝.conf文件到镜像下，替换掉原有的nginx.conf
RUN echo 'build img ok!' #输出完成

创建Nginx配置文件

Nginx配置文件内容：

用于对Nginx服务的配置

worker_processes auto;

events {
    worker_connections 1024;
}

http {
 include             mime.types;
 
 default_type        application/octet-stream;
 
 sendfile            on;
 
 keepalive_timeout 65;
 
 client_max_body_size 20m;
 
 ###### blogapp begin #######
    server {
        listen       80;
        server_name  localhost;
        location / {
			root /usr/share/nginx/html; #配置Vue项目根路径,与
			index index.html index.html; #配置首页
			try_files $uri $uri/ /index.html; #防止刷新报404
        }

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

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

完成文件准备后，把文件ftp到服务器下。

构建镜像、启动容器

1、构建容器

进入vue项目文件夹下（我的目录为/home/Memoyu.Blog.App下）

构建镜像：

docker build -t memoyu/blogappimg . 
#-t  为容器重新分配一个伪输入终端，通常与 -i 同时使用；
#memoyu/blogappimg  为容器名称
#.  该点为当前目录

查看当前所有镜像：

docker images

删除镜像：

docker rmi imageID
#imageID  为需要删除镜像的ID，删除前需保证没有容器在引用

2、启动容器

启动容器：

docker run --name blogappcontainer -it -p 9002:80 memoyu/blogappimg
#--name blogappcontainer  --name为配置容器名称，空格后跟容器名称
#-it  容器的 Shell 映射到当前的 Shell，然后你在本机窗口输入的命令，就会传入容器。
#-p  为配置容器端口映射，容器中的80端口映射到本机的9002端口（默认容器内端口为80）
#memoyu/blogappimg  镜像名称
#**在执行当前命令时，会进行容器日志打印，使用ctrl+c可跳出，同时容器会终止，需重新启动容器，否则，如果不需要查看日志，可以使用-d参数**

查看当前容器：

docker ps -a
-a  为查看全部，如果没有-a则未查看在运行的容器

启动容器：

docker start containerID
#containerID  为需要启动的容器ID

停止容器：

docker stop containerID
#containerID  为需要停止的容器ID

删除容器：

docker rm containerID
#containerID  为需要删除的容器ID,删除前需要保证容器处于停止状态

至此，容器已经构造并启动完成！