由于近期项目需要实现自动构建部署前端vue工程，在此留作记录。
本文主要描述使用Jenkins进行自动化构建Vue项目通过Docker容器部署，并将镜像推送至Harbor镜像仓库的过程。关于Jenkins、Docker、Harbor的安装不做讲解。
一、依赖
Jenkins版本：2.317
Docker版本：18.06.0-ce
Harbor版本：v2.1.0-a3eca103
二、Dockerfile文件
-
建立dockerfile文件
Vue工程根目录下创建文件Dockerfile
image.png
文件内容如下：
# build stage
FROM node:12-alpine as build-stage
# 创建一个工作目录
WORKDIR /app
# 复制符合.dockerignore规则的文件
COPY . .
# 安装依赖
RUN npm install cnpm -g --no-progress --registry=https://registry.npm.taobao.org
RUN cnpm install --no-progress
# 构建
RUN npm run build
# production stage
# 使用nginx镜像
FROM nginx:stable-alpine as production-stage
# 使用--from把上面产生的静态文件复制到nginx的运行目录
COPY --from=build-stage /app/dist /usr/share/nginx/html
# nginx容器内部暴露的端口
EXPOSE 8064
# 运行的命令
CMD ["nginx", "-g", "daemon off;"]
- 建立.dockerignore文件
Vue工程根目录下创建文件.dockerignore。目的：为了防止工作目录过大，防止像node_modules这种文件被拷贝进来。
# Dependency directory
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
node_modules
.DS_Store
dist
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release
.dockerignore
Dockerfile
*docker-compose*
# Logs
logs
*.log
# Runtime data
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw*
pids
*.pid
*.seed
.git
.hg
.svn
三、Jenkins构建并推送仓库
1、建立视图及Item
2、相关配置
注意：可提前在harbor上构建好项目，此处地址配置为：IP地址/项目/镜像名称:tags，那么启动Jenkins构建在构建成功后将自动推送到harbor上。
注意：需要先在Jenkins上安装好[Date Parameter Plugin]插件。
3、shell命令
① 检查容器
echo "获取当前容器是否存在-----------------------------------------------------------------"
containerps=$(docker ps -f name=test_web -q)
containerstop=$(docker ps -a -f name=test_web -q)
for alpha in "$containerps";do
if [ "$alpha" == "" ];then
echo "检查是否存在停止的容器-------------------------------------------------"
for alpha1 in "$containerstop";do
if [ "$alpha1" == "" ];then
echo "不存指定容器-----------------------------------"
else
echo "存在停止了的 然后直接删除-----------开始------------------"
docker rm $alpha1
echo "存在停止了的 然后直接删除-----------完成------------------"
fi
done
else
echo "存在-停止运行 然后删除----------------------开始-----------------"
docker stop $alpha
docker rm $alpha
echo "存在-停止运行 然后删除---------------------完成------------------"
fi
done
其中“test_web”为容器名称。
② 构建镜像
# build docker image 每次构建不产生缓存
docker build --no-cache -t ${PushVersion} .
③ 运行容器
运行容器
docker run -d -p 8064:80 --restart always --name test_web \
-v /opt/app/test_web/app/volumes/config:/usr/share/nginx/html/config \
${PushVersion}
④ 删除中间镜像及推送
echo "删除中间层镜像-------------------------------完成----------------------------------"
docker rmi $(docker images -f "dangling=true" -q)
echo "删除中间层镜像-------------------------------完成----------------------------------"
echo "推送镜像到镜像仓库------------- 开始----------------------------------"
docker push ${PushVersion}
echo "推送镜像到镜像仓库------------- 完成----------------------------------"
四、Docker相关常用命令
- 构建镜像
docker build -t mytestapi .
注意：mytestapi为镜像名称，镜像名称后面有一个点
- 运行镜像
docker run -d -p 8064:80 --restart always --name sc_testapi \
-v /opt/app/sc_testapi /app/volumes/config:/usr/share/nginx/html/config \
mytestapi
注意：端口： 映射宿主机8064端口到容器的80端口。（因此处nginx默认80）
-v 挂载配置文件。宿主服务器主机目录:容器目录
mytestapi 镜像名称
- 查看镜像
docker images
- 删除镜像
docker rmi 镜像ID
- 查看容器
docker ps -a （查看所有容器）
docker ps （查看运行中容器）
- 删除容器
docker rm 容器ID
- 停止容器
docker stop 容器ID
- 启动容器
docker start 容器ID
- 重启容器
docker restart 容器ID
- 打包镜像并下载
保存：
docker save b1370b8cdc8c> /root/myyewuxitong-save-0523.tar
下载：
sz myyewuxitong-save-0523.tar
- 进入运行中容器
docker exec-it 容器ID /bin/bash
docker exec-it 容器ID bash
docker exec-it 容器ID sh 具体docker相关常用知识自行学些
五、Harbor镜像仓库
