持续集成部署实践

date
Apr 23, 2018
slug
CI-CD
status
Published
tags
DevOps
summary
自动化这个字眼神圣而又高大上,对后端开发的同学来说也许再熟悉不过了,可对于前端开发来说,确实有些遥不可及,接下来分享下,我在前端项目的自动化实践。
type
Post

前言

自动化这个字眼神圣而又高大上,对后端开发的同学来说也许再熟悉不过了,可对于前端开发来说,确实有些遥不可及,接下来分享下,我在前端项目的自动化实践。

实现方式

  • 一套是工作中经常使用的 Docker + Jenkins。Jenkins 是持续集成的关键。
  • 使用 DaoClound
jenkins 的使用成本还是比较高的,因为需要搭建 Jenkins 的基本环境,但使用率想到高。我主要介绍的是第二套方案,成本低,但能实现自动化的功能。

DaoCloud 的使用

  1. 主机接入与集群管理
    1. 需要将自己的虚拟机接入到 Daocloud,具体看这里
  1. 用 Docker 搭建前端应用
先看看我的项目
notion image

具体实现步骤

这是 wo 博客实现自动化构建的过程
  1. 在项目的根目录加入 dockerfile 文件 上述内容就实现了将手动的命令,写成脚本让其实现自动执行的功能。dockerfile 是实现项目容器化的必备配置文件。
    1. notion image
  1. 镜像的自动化构建(使用 github)代码源指定了您项目的代码仓库位置,关联代码源后,您对代码源的操作会自动触发项目的相应动作比如持续集成和镜像构建。 选择目标项目,填写镜像名称,点击开始创建 点击前往流程定义按钮 点击手动构建选择需要构建的分支 上面一步就表示自动化构建成功了。
    1. notion image
      notion image
      notion image
      notion image
      notion image
      notion image
      notion image
  1. 把构建的镜像发布到自己搭建的主机上 点击目标项目部署最新版按钮 下面这一步就表示部署成功了 点击下面的提示的连接访问部署的项目 打开下面的自动发布按钮,每次项目 push 到目标分支都会进行自动构建和部署
    1. notion image
      notion image
      notion image
      notion image
      notion image

最后

博客实例robinblog
angular 实例 ng-ant-admin
步骤写的比较简单,如果有不懂的可以在我的 blog 给我发消息。
If you have any questions, please contact me.