23、Jenkins容器化部署Vue应用

23、Jenkins容器化部署Vue应用

1、准备Dockerfile

将Dockerfile文件放入项目目录下

# 基础镜像
FROM registry.cn-hangzhou.aliyuncs.com/xx_blog/nginx:1.27.2

# author
MAINTAINER maintainer="xx@qq.com"

# 复制html文件到路径
COPY dist/ /usr/share/nginx/html

EXPOSE 80

启停脚本一并上传

2、新建流水线工程

my-vue-app-docker

3、执行脚本修改一下

node -v
yarn -v
yarn install
yarn build

SERVER_NAME=my-vue-app

chmod 777 stop_container.sh && bash stop_container.sh ${SERVER_NAME} $BUILD_NUMBER

docker build -t ${SERVER_NAME}:v${BUILD_NUMBER} .

docker tag ${SERVER_NAME}:v${BUILD_NUMBER} 112.74.160.27:8081/xx-blog/${SERVER_NAME}:v${BUILD_NUMBER}
echo "Harbor12345" | docker login 112.74.160.27:8081 -u "admin" --password-stdin
docker push 112.74.160.27:8081/xx-blog/${SERVER_NAME}:v${BUILD_NUMBER}

docker run -d --name=${SERVER_NAME} -p 80:80 ${SERVER_NAME}:v${BUILD_NUMBER}

4、运行成功