在Ubuntu22.04上使用Jenkins+Docker 持续集成前端vue项目

环境依赖

docker,docker-compose

第一步:在 /home/nginx 配置Nginx的docker-compose和default.conf

1. docker-compose.yml

   version: '3.1'
   services:
     nginx:
       image: nginx
       restart: always
       container_name: nginx
       environment:
         - TZ=Asia/Shanghai
       ports:
         - 9999:9999
       volumes:
         - /home/nginx/conf.d:/etc/nginx/conf.d
         - /home/nginx/logs:/var/log/nginx
         - /home/nginx/html:/html
   

2. default.conf 就是 nginx.conf
3. 启动nginx

   docker-compose up -d
   

第二步:安装jenkins插件

NodeJS,Publish Over SSH,Timestamper

第三部.配置jenkins插件

1. 配置NodeJS
2. 配置Publish Over SSH
   

第四步:新建Jenkins任务

前面选项和java项目一样.从构建环境开始

3. 构建环境
   

4. 新增构建任务 ==>> 执行 shell
   

   echo $PATH
   node -v
   npm -v
   pwd
   npm run build:stage
   tar zcvf dist.gz -C dist .
   

5. 新增构建任务 ==>> Send files or execute commands over SSH
   

6. 新增构建任务 ==>> Execute shell script on remote host using ssh(这里上这一步可以和上一步合并)
   

   echo '开始构建'
   cd /home/nginx
   pwd
   rm -f -r html
   mkdir html
   mkdir html/benchu
   tar -xvf /home/nginx/dist.gz -C /home/nginx/html/benchu
   rm dist.gz #这一句代码在调试成功之后再加上
   docker-compose restart
   echo '构建完毕'
   

注意事项

1. jenkins服务器需要安装 npm

   wget https://nodejs.org/dist/v16.16.0/node-v16.16.0-linux-x64.tar.xz
   tar xf node-v16.16.0-linux-x64.tar.xz
   mv node-v16.16.0-linux-x64 /opt/
   ln -s /opt/node-v16.16.0-linux-x64/bin/node /usr/local/bin/
   ln -s /opt/node-v16.16.0-linux-x64/bin/npm /usr/local/bin/
   
   # 如果需要cnpm的话
   npm install -g cnpm --registry=https://registry.npm.taobao.org
   ln -s /opt/node-v16.16.0-linux-x64/bin/cnpm /usr/local/bin/