实现思路
1.程序员在本地进行开发
2.程序员将批改后的代码提交到gitlab代码仓库
3.gitlab收到代码后通过webhook告诉jenkins进行构建
4.jenkins构建好了当前将构建好当前的代码公布的到线上服务器
劣势
gitlab、jenkins、生产服务器这三个服务都能够散布在不同的服务器, 所以大大提高了可配置性也升高了耦合。
环境筹备
- gitlab代码仓库(能够在线上, 也能够在本地)
- jenkins服务(能够跟gitlab不在同一个服务器上, 然而这里没有必要, 我把gitlab和jenkins都部署在本地服务器)
- 生产环境
gitlab和jenkins服务我都是通过docker-compose进行装置的, 这个具体我就不多说了, 上面我贴一下docker-compose.yml文件
# gitlab的docker-compose.yml文件version: "3"services: gitlab: image: twang2218/gitlab-ce-zh container_name: gitlab restart: always privileged: true hostname: '192.168.4.2' environment: TZ: 'Asia/Shanghai' GITLAB_OMNIBUS_CONFIG: | external_url "http://192.168.4.2:82" gitlab_rails['time_zone'] = 'Asia/Shanghai' gitlab_rails['gitlab_shell_ssh_port'] = 2222 gitlab_rails['gitlab_email_enabled'] = true gitlab_rails['gitlab_email_from'] = 'liaoxubao@aliyun.com' gitlab_rails['gitlab_email_display_name'] = 'liaoo' gitlab_rails['smtp_enable'] = true gitlab_rails['smtp_address'] = "smtp.aliyun.com" gitlab_rails['smtp_port'] = 465 gitlab_rails['smtp_user_name'] = "liaoxubao@aliyun.com" gitlab_rails['smtp_password'] = "jhudkir123" gitlab_rails['smtp_domain'] = "aliyun.com" gitlab_rails['smtp_authentication'] = "login" gitlab_rails['smtp_enable_starttls_auto'] = true gitlab_rails['smtp_openssl_verify_mode'] = 'peer' gitlab_rails['smtp_tls'] = true nginx['listen_port'] = 82 ports: - '82:82' - '2222:22' volumes: - '/mydata/gitlab/config:/etc/gitlab' - '/mydata/gitlab/logs:/var/log/gitlab' - '/mydata/gitlab/data:/var/opt/gitlab' logging: driver: "json-file" options: max-size: "20m" max-file: "10"# jenkins的docker-compose.yml文件version: '3.1'services: jenkins: image: jenkins/jenkins restart: always container_name: jenkins environment: TZ: Asia/Shanghai ports: - "8888:8080" user: root volumes: - ./data:/var/jenkins_home两个服务跑起来, 不跟你多BB, 撸起袖子就是一行hello world
咱们先在本地创立一个vue我的项目
vue create hello world# 回车回车回车...cd cdproject/npm run serve# 把我的项目跑起来, 而后咱们就看到了这个而后咱们再去gitlab上新建一个我的项目
接下来咱们去本地生产一套rsa格局的ssh-keygen
ssh-keygen -m PEM -t rsa -b 4096 -C "thatsfelix"公钥放到你gitlab上的集体设置外面, 这样你就能够通过ssh去push你的代码到服务器了, 具体位置在这里:
接下来咱们试着将本地代码提交到gitlab仓库
cd cdproject/git initgit remote add origin ssh地址(如果不懂这个地址在哪里看上面的图)git remote -v (查看仓库增加进去没有)git add .git commit -m "first push"git push -u origin master
操作胜利咱们去gitlab代码仓库看看
这里咱们能够看到咱们的代码曾经提交上来了
接下来咱们去配置jenkins
装置插件的时候因为我是小白, 所以我抉择举荐装置
新建一个我的项目
这里先暂停一下
因为咱们的jenkins要从gitlab拉取代码, 所以咱们先去凭据外面增加一个私钥, 就是咱们一开始生成的那个
另外咱们还须要这三个插件
因为咱们代码构建完了当前要通过ssh进行公布, 所以咱们这里装一个publish over ssh的插件
因为咱们要应用nodejs进行打包, 所以咱们在装一个nodejs的插件
以上装完了当前重启一下jenkins
nodejs这个不是真正的nodejs, 他只是一个相似于容器一样的插件, 所以咱们要装一下nodejs工具, 在这里:
好了, 咱们持续回到刚刚创立我的项目那里:
这里抉择咱们刚刚增加的全局凭据的那个私钥
这个构建的shell是在咱们的jenkins容器外面执行的
点这里, 而后你这边就什么都没有, 这时候你须要增加一下你近程服务器的配置
填完当前点测试(这个公钥记得放到你的线上服务器下面哦)
测试胜利当前咱们点保留
咱们点击立刻构建, 能够看到咱们的我的项目曾经开始构建了
然而要想实现push当前马上就主动构建, 咱们还须要最初一步操作:
咱们先复制一下构建配置外面的这个地址:
而后咱们来到gitlab的我的项目目录下, 而后点这里:
如果你看到了这个谬误提醒:
意思是说不容许对本地发动申请, 这时候咱们去放开一下权限即可, 在这里:
再次增加, 而后胜利了, 而后咱们点这里
开展有个push event, 咱们测试一下
报403谬误，
而后咱们进到jenkins的这里:
这个勾上, 保留
而后再来这里
这个勾去掉, 保留
再回到gitlab, test >>> push events, 而后咱们看到了http: 200的状态码
至此, 咱们的主动构建的配置就实现啦, 而后咱们去本地提交一波，
git add .git commit -m "cd 3"git push而后就能够看到咱们的代码开始主动构建啦
接下来, 咱们开始书写构建脚本和部署脚本, 持续回到我的项目配置:
构建脚本, 如图:
这个很简略不必解释了哈
构建后操作:
这里测试后我发现第二次构建会有问题, 产生的起因是因为执行cp命令时,如果问价或文件夹已存在, 会提醒是否要笼罩, 这里咱们应用
\cp -r /mydata/nginx/html/manage/dist/* /mydata/nginx/html/manage/# 斜杠的意思就是间接笼罩并且不询问而后咱们去本地push一波, 拜访线上地址:
而后去本地批改一下, 再去拜访线上地址:
完满~! 历时17天, 终于, 跑通了CD/CD的流程, 如果你想通过2个小时来学习这个流程, 难度应该是比拟大的, 倡议你动起手来, 遇到文件就多查查材料, 置信你也能够学有所获！