前端项目的部署
我们了解完上篇的知识有什么用呢？留下印象的感觉也就是「建」、「推」和「拉」，其实有这三板斧差不多就够了，部署用到其他的储备，我们平时都已经积累好了，各位看官继续请往下瞧~
建 Build
上面我们知道，可以通过创建Dockerfile来本地定制化创建我们所需的镜像，我们先通过vue cli创建一个新项目
npm install vue-cli -g
vue init webpack docker-ci
cd docker-ci
touch Dockerfile
项目创建好，接下来在项目的根目录中新建的Dockerfile中写入下面的内容：
# build stage 前面我们知道这个是根据node镜像创建容器 as build-stage 意思是将该容器的地址指向到build-stage这个变量上，供后面使用
FROM node as build-stage
# 创建一个工作目录，相当于在node容器中，创建了一个app的目录
WORKDIR /app
# 将当前目录拷贝到上面的工作目录中，这样就把本地的代码复制到node容器中了
COPY . .
# 除了run 后面是不是熟悉的味道
# RUN：用于执行后面跟着的命令行命令 注意：在docker build的时候执行
RUN npm install --no-progress --registry=https://registry.npm.taobao.org
# 还是熟悉的知识储备，没骗你们吧
RUN npm run build
# production stage 这边就是根据nginx:stable-alpine镜像创建了一个nginx容器
FROM nginx:stable-alpine
# 和上面一样，将build-stage指向的node容器中 /app/dist 目录拷贝到我们nginx容器中的网站根目录下面
COPY --from=build-stage /app/dist /usr/share/nginx/html
# 设置nginx镜像服务的守护端口，以方便配置映射
EXPOSE 80
# 开启nginx服务
CMD ["nginx", "-g", "daemon off;"]
好啦~看完上面，除了几个关于Dockerfile的指令不太熟悉之外，其他都是我们的老朋友了，根据我们之前学习到的，接下来就可以通过根目录下的这个容器配置文件生成一个容器服务了~
1. 根据当前目录下的配置文件创建容器 -t：后台运行，这里有一个windows container的坑，切回linux container就 没有这个问题了
docker build -t my-web .
2. 运行容器 docker run -itd[-i: 开启交互式操作。-t: 开启终端 这两个必须开启才能执行开启nginx服务的命令] --name [container-name] -p [nginx容器服务对外端口]:[nginx容器守护端口] [image-name]:[tag]
docker run -itd --name my-run-web -p 22500:80 my-web
从上面的红色框内可以看到，其他build的过程中就是解析并执行Dockerfile内容的过程，最后出现绿色框内的内容说明成功的将本地项目在所创建的镜像中，进行了依赖安装和构建
根据刚才所创建的镜像，运行一个已开启的暴露 22500 端口的 nginx 服务容器~接下来我们访问http://localhost:22500/#/试试
通过上面我们了解到，使用Dockerfile定制化我们的本地容器，在build的时候，将本地需要构建的项目拷贝到
node 容器中进行构建，然后在run的时候，将构建好的项目部署到对应的
ngixn 容器开启的 WEB 服务上，整个流程一气呵成
推 Ship
想象一下，我们不可能每次部署一个项目，都去项目的根目录新建一个配置文件，然后手动build和run，那么理论上我们每次的构建流程都是一样的，也就是镜像的功能是一致的。所以我们可以把我们定制化好的镜像推送到
DockerHub 上，再将构建部署的命令封装成一个sh文件，那么在一定程度上就节约了时间和人力成本了，也降低了风险
# 还记得上面说的不，如果我们push的是非官方的镜像，需要在名称前面加上我们的用户名，所以我们可以重新复制一个拥有合法名称的新镜像出来
docker tag my-web leontwo/my-web
# 可以看到新镜像已经创建好了
docker images
# 然后直接往我们的仓库推
docker push leontwo/my-web
success~
拉 Run
现在我们就可以尝试在任意的终端内以及任意的项目下，拉取我们远程的镜像，执行同样的事情，获得相同的结果~这个过程其实和上面的演练差不多，这里就不赘述了。
如果想部署到远程服务器上，可以基于Jenkins创建一个容器服务替代我们本地的nginx服务，至于如何操作Jenkins可以参考我的这边文章：前端自动化部署
Jenkins 最佳实践
总结
其实通过上面一些比较简单的实操，大家应该能体会一点docker去做CD/CI的好处了，借用docker的两个口号
「Build, Ship and Run」
「Build once，Run anywhere」
