# 前言
Jenkins 持续构建集成是软件版本迭代的一大利器,对于前端攻城狮来说,本身对服务器的接触就少,也并不愿意去做这个事。Jenkins持续构建省去了繁琐的服务器替换包的过程,同时有历史构建记录和每次构建的变更记录,这为我们回退和检查构建情况提供了便利。
本文假设你已经搭建了一些基础环境,如Git环境,Node环境等。如未处理请自行百度
# Jenkins配置步骤
1. 在Jenkins中进入你要配置自动构建的项目
![1d5be5a02552c4a1450abb34835b9789.png](https://i-blog.csdnimg.cn/blog_migrate/132cd08f408f7d906953e3962af5caca.jpeg)
要设置自动构建的项目
2. 点击左侧配置选项进行项目发包配置(首先你得有配置的权限)
![f2daaf28ece949fea8486bcdaf770d25.png](https://i-blog.csdnimg.cn/blog_migrate/cd8dafe4046f447d81fd7ca8ba5544fc.jpeg)
工程中点击配置
3. 对项目的各个模块进行信息填写
这一步是比较关键的,配置文档有几个信息需要填写
- 属于描述解释类信息,可以不填
![67af8b0f67deb1e0b9eb73ffd79c24e3.png](https://i-blog.csdnimg.cn/blog_migrate/1873b3d3992ee61fc6e26912f2abf8d3.jpeg)
- 填写构建仓库信息,你要发布的代码就从这里拷贝过来的
![63b8b5c6ba54a43b67f77e8ee4967b66.png](https://i-blog.csdnimg.cn/blog_migrate/ce2da81d8fe4e456edfe9823d1e1f00e.jpeg)
源码管理模块
- 设置git触发构建的动作
![f08ee0e87635a80c72047e3e7f94a514.png](https://i-blog.csdnimg.cn/blog_migrate/a4abe0d5afb64c6309b6a0a1663f3ca8.jpeg)
设置触发器
- 选用node作为构建环境
![5ba1e82c6447c192285e72386ff0b66e.png](https://i-blog.csdnimg.cn/blog_migrate/bfb4ce84a11c212fcc9d5d2d2cd0bdac.jpeg)
构建环境设置
- 构建执行的脚本命令
![f123aaa805074b6916ea8421b46c4b25.png](https://i-blog.csdnimg.cn/blog_migrate/69ebcd61c3778b32c3ea9d7fccf9d733.jpeg)
构建脚本命令
至此,关于Jenkins的配置已经处理完成了。此时已经能实现手动发版时拉取最新的GitLab上指定分支的代码。
当然,笔者并不满足于此,还想实现git push后自动发版的配置,真正实现自动持续构建集成# GitLab配置步骤
1. 进入配置自动构建的项目
![f4a515a2f96b40c0ad710e138bf3de66.png](https://i-blog.csdnimg.cn/blog_migrate/6c4e5f96c0284cc6a019731d972e6d50.jpeg)
选中要配置的项目
2. 点击 setting --> Integrations 设置Webhooks
![83233dbebe39052c8ffdeeb6ad66d1fa.png](https://i-blog.csdnimg.cn/blog_migrate/846c86af0e8cc2c9ffdc0bb928edc390.jpeg)
设置webhooks
3. 增加一个webhook
(1)Jenkins的回调地址,在Jenkins配置中的3.3步骤中笔者已标明
(2)secret token 也需要去Jenkins配置中生成。还是在如上3.3配置截图中,右下角有一个高级按钮,点开展示如下:
![c3f61126f94ea7e6b7cd2029b8b5da57.png](https://i-blog.csdnimg.cn/blog_migrate/f3268a958219dc49682cb71573e0bb8f.jpeg)
生成secret token
OK,我们来添加一个webhook并进行测试
![70b9b34593e7ee5e6bd4462048776c61.png](https://i-blog.csdnimg.cn/blog_migrate/b15246a2af48b460cbece92afc7e6e39.jpeg)
添加webhook
点击测试可达性,如果页面提示如下,说明webhook添加成功
![2f4beb0391071a3fedfdbf002a42638a.png](https://i-blog.csdnimg.cn/blog_migrate/1cd63fb5dfd3f6273acfaf0e6c3167ff.jpeg)
测试结果
好了,去你的项目中试试git push 操作吧
记得关注小编哦!