likes
comments
collection
share

初识Jenkins

作者站长头像
站长
· 阅读数 14

背景

大家知道我之前搭了个博客,地址是 www.xiaojieboshi.com ,搭建的过程大家可以看《1小时带你搭建vuepress高大上个人博客》 这篇文章。但是有个问题,就是我每次写完博客发布到服务器上很繁琐,我一直想搞一个自动发布,持续集成,但是一直在忙别的事耽误了。这次我决定研究一下,把这件事给做了。

目的

大家可以看下之前我的一种工作模式,首先代码是我写的,然后我要本地执行run npm build编译一下,然后推到github上面去,然后把生成的aaa文件夹打成压缩包,这个就是可以直接运行查看的文件,然后通过工具上传到linux服务器,然后在服务器上解压放到对应的文件夹下,然后重启下nginx,一套流程下来,十分的繁琐,粉色的步骤都是需要我做的。 初识Jenkins

但是我要达到的效果就是自动化部署,就是下面粉色的,我只要做编写代码以及push到github,剩下的通通由jenkins来帮我做完,这个就是本篇文章需要实现的效果。 初识Jenkins

最后交代一下我买了一台腾讯云的服务器,43.128.34.245,jenkins和nginx都部署在上面,如下面所示: 初识Jenkins

接下来就是开始操作

Linux安装jenkins

1、安装jdk

记得安装jdk11或者17,因为这里有一个坑,从2022年7月2日起,jenkins新版本不再支持java8,仅支持java11和java17,否则会报错。

初识Jenkins

2、上官网查找自己想要的版本mirrors.jenkins-ci.org/redhat/

初识Jenkins 3、选择需要的版本下载到本地,然后上传到linux服务器

初识Jenkins 4、直接安装

rpm -ivh jenkins-2.364-1.1.noarch.rpm

安装成功 初识Jenkins

5、修改启动端口

vim /etc/syscofig/jenkins

我这里把端口号改成了1234

初识Jenkins

6、配置jdk路径

vim /etc/init.d/jenkins

找到candidates这个变量,然后把安装的jdk11或者17路径添加进去

初识Jenkins

7、重新加载一下

systemctl daemon-reload

8、启动jenkins

cd /etc/init.d

# 启动
./jenkins start
# 停止
./jenkins stop
# 查看状态
./jenkins status

已经成功跑起来了 初识Jenkins

访问和初始化jenkins

1、输入http://43.128.34.245:1234/

IP是服务器IP地址,端口号是我刚刚设置的端口号

初识Jenkins

2、输入密码

进入上面红色的路径/var/lib/jenkins/secrets/initialAdminPassword

# 查看秘钥
cat /var/lib/jenkins/secrets/initialAdminPassword

然后把秘钥拷出来放进去,点击继续

初识Jenkins 3、安装插件

我们选择推荐的即可

初识Jenkins

这个就是正在安装的页面 初识Jenkins 4、设置admin账户

我们可以用默认的admin账号,但是建议自己重新创建一个

初识Jenkins

保存并完成

初识Jenkins

成功进入到界面 初识Jenkins

准备工作

增加权限

jenkins在执行shell脚本的时候会报权限不够,这时候我们需要给jenkins root的权限。

初识Jenkins

修改配置文件

vim /etc/sysconfig/jenkins

把JENKINS_USER="jenkins"  改成 root

初识Jenkins

修改Jenkins相关文件夹用户权限

chown -R root:root /var/lib/jenkins
chown -R root:root /var/cache/jenkins
chown -R root:root /var/log/jenkins

重启下jenkins

安装nodejs

因为我们的项目是要用到node打包的,所以先在jenkins中安装nodeJs插件

进入到插件管理,搜索nodejs,然后选中安装即可 初识Jenkins

安装完成后进入到全局工具管理,选择新增nodejs,选择版本,这个很重要,太高了可能会报错,选择和本地一样的版本稳妥,填上别名,打钩自动安装,然后保存即可。

初识Jenkins

修改服务器时间

查看服务器时间

timedatectl | grep "Time zone"

初识Jenkins

进入jenkins的管理,选择脚本命令行 初识Jenkins

输入命令,点击运行即可

System.setProperty('org.apache.commons.jelly.tags.fmt.timeZone','Asia/Shanghai')

初识Jenkins

创建任务

点击左侧的新建item 初识Jenkins

输入名字,选择第一个,创建一个freestyle

初识Jenkins

General

通用这填下描述,构建记录保持7天,最多保持10次构建,还有github的地址

初识Jenkins

初识Jenkins

源码管理

设置github项目的仓库地址,我们看下报错了,蓝色框框里的信息,什么意思呢,就是你原先的密码凭证从2021年8月13日开始就不能用了,必须使用个人访问令牌(personal access token),就是把你的密码替换成token!

初识Jenkins

所以我们在添加凭证的时候,这里的密码不能填写密码,而是要填github上生成的token初识Jenkins

添加完成后报错消失,选择构建的分支为master分支

初识Jenkins

构建环境

选择全局工具管理里面安装的nodejs

初识Jenkins

构建步骤

选择新增shell脚本

初识Jenkins

在里面输入几行脚本,然后点击保存 初识Jenkins

回到项目的管理界面测试一下,首先点1 Build Now,然后看到2处就会有个构建,构建完成后会变成绿色打钩,然后点3工作空间,可以看到4有个aaa文件夹生成了,这个就是jenkins把git上的代码拉下来,然后编译打包放到了aaa文件夹,这个就是可以直接运行的文件。

初识Jenkins

那么为什么会生成到aaa文件夹,因为这是我在代码里面配置的。 初识Jenkins

好,测试完成了,接下来就是把生成的文件部署到nginx,因为这里我是把jenkins和nginx装到了一台机器上,所以直接把文件夹拷到nginx的工作空间即可,如果是分别装在两台机器上,则需要装Publish over SSH插件,由jenkins的机器把打好的包远程传输到nginx的那台机器上部署。

我们看下剩下的命令

初识Jenkins

那为什么我把页面解压缩到/jack/aaa下,然后重启下nginx就能生效了,其实还是我在nginx里面配的,在nginx.conf里,默认就是访问这个文件夹下面的页面。

初识Jenkins

至此,新建一个Job就结束了。

Webhook

好,还差最后一步,我们看到上面演示的时候构建是手动点的Build Now这个按钮,虽然点一下也不累,但是还是想偷懒,不想手动点怎么办。就是做Webhook,就是我每次开发完,代码推到github,自动触发构建。

1、打开github,在settings里面增加一个webhook 初识Jenkins

2、在Payload URL填写jenkins的地址+/github-webhook/这是固定格式 初识Jenkins

3、打开项目的配置,在构建触发器github hook这里打上勾,保存下即可 初识Jenkins

4、测试一下,我在源码标题这里加了一个1

初识Jenkins

5、推送一下github,我们看commit记录是21点56分

初识Jenkins

6、我们看下jenkins上已经自动创建了一个构建任务,说明webhook已经成功了。现在的时间是21点59分,那么为什么差了三分钟,主要是我commit完代码,push了好几次才成功的,github大家都懂的,不是很好访问的,所以真正push成功是在59分。

初识Jenkins

7、最后访问下博客,发现标题也成功的改掉了,多了一个1

初识Jenkins

演示圆满成功

结束语

以上就是我在实现前端项目自动化部署的全部过程,学习过程总是需要自己动手去操作才能知道有没有真的掌握,期间其实遇到很多问题,通过一步步排查、查阅资料,最终完成搭建,自动化部署的方案有很多种,这里我选用的是jenkins的一种,最后欢迎小伙们点赞、收藏、关注,一键三连,谢谢~

转载自:https://juejin.cn/post/7137312486256017439
评论
请登录