当前位置:首页 > 科技  > 软件

图解 Jenkins Pipeline 的前端自动化部署,用上后真香!

来源: 责编: 时间:2024-06-28 17:16:06 267观看
导读一、Jenkins 前端部署思路1.1 整体架构图图片1.2 部署步骤图片二、Pipeline和自由风格对比Jenkins是一个开源的自动化服务器,它可以帮助自动化各种任务,包括构建、测试和部署软件。上次我们讲解了如何通过 Jenkins 的自

一、Jenkins 前端部署思路

1.1 整体架构图

图片图片H0N28资讯网——每日最新资讯28at.com

1.2 部署步骤

图片图片H0N28资讯网——每日最新资讯28at.com

二、Pipeline和自由风格对比

Jenkins是一个开源的自动化服务器,它可以帮助自动化各种任务,包括构建、测试和部署软件。H0N28资讯网——每日最新资讯28at.com

上次我们讲解了如何通过 Jenkins 的自由风格的软件项目来配置前端的自动化部署,如下图所示,如何选择自由风格的软件项目。优点就是简单!H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

这次我们将讲解如何通过流水线(Pipeline)方式来部署前端项目。优点就是更加灵活!如下图所示,就是选择 Pipeline 方式。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

在Jenkins中,有两种主要类型的任务:Pipeline任务和自由风格项目(Freestyle project)。H0N28资讯网——每日最新资讯28at.com

  1. Pipeline任务:

Pipeline任务是Jenkins 2.0引入的一个新特性,它使用Jenkinsfile来定义整个构建流程。H0N28资讯网——每日最新资讯28at.com

Jenkinsfile是一个文本文件,使用Groovy语言的DSL(领域特定语言),可以定义构建的各个阶段和步骤。H0N28资讯网——每日最新资讯28at.com

Pipeline任务支持复杂的构建流程,包括多个阶段和步骤,以及并行执行等高级功能。H0N28资讯网——每日最新资讯28at.com

Pipeline任务可以很容易地与源代码管理系统集成,支持持续集成(CI)和持续交付(CD)。H0N28资讯网——每日最新资讯28at.com

  1. 自由风格项目:

自由风格项目是Jenkins早期版本中的主要任务类型,允许用户通过Jenkins的Web界面配置构建步骤。H0N28资讯网——每日最新资讯28at.com

这种类型的项目没有固定的构建流程定义方式,用户可以手动添加构建步骤、配置插件和参数等。H0N28资讯网——每日最新资讯28at.com

自由风格项目适合快速设置简单的构建任务,但对于复杂的构建流程,可能不如Pipeline任务灵活和强大。H0N28资讯网——每日最新资讯28at.com

两者的主要区别包括:H0N28资讯网——每日最新资讯28at.com

定义方式:Pipeline任务通过Jenkinsfile定义,而自由风格项目通过Jenkins的Web界面配置。H0N28资讯网——每日最新资讯28at.com

灵活性和扩展性:Pipeline任务更加灵活,支持复杂的构建流程和高级功能,如并行执行和模板化。H0N28资讯网——每日最新资讯28at.com

集成度:Pipeline任务更容易与源代码管理系统集成,实现自动化的CI/CD流程。H0N28资讯网——每日最新资讯28at.com

学习和使用难度:Pipeline任务可能需要用户学习Jenkinsfile的语法和DSL,而自由风格项目则更直观,易于上手。H0N28资讯网——每日最新资讯28at.com

提示:Pipeline 任务代表了Jenkins的未来方向,提供了更高级的自动化构建能力,而自由风格项目则适合快速设置简单的构建任务。随着Jenkins的发展,越来越多的用户和组织倾向于使用Pipeline任务来实现更高效的自动化流程。H0N28资讯网——每日最新资讯28at.com

三、Pipeline 核心脚本

3.1 获取 Git 代码分支

3.1.1 Git 分支插件

用了一个插件 gitParameter,可以获取 git 仓库的分支,部署的时候,可以选择分支。如下图所示,Git 仓库有 develop 和 master 分支,默认选中 develop 分支。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

3.1.2 Git 环境变量

图片图片H0N28资讯网——每日最新资讯28at.com

3.1.3 获取 Git 分支代码

图片图片H0N28资讯网——每日最新资讯28at.com

这个步骤中有一一行关键的代码,可以通过 Git 插件获取选择的 Git 分支。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

3.2 拷贝依赖包

因为 node_modules 不会上传到 git 仓库,所以我们需要提前准备好。H0N28资讯网——每日最新资讯28at.com

而我们项目我是先在有网的 Linux 服务器上用 npm install 命令下载的依赖包,然后手动压缩拷贝到 jenkins 服务器的 passjava 目录。H0N28资讯网——每日最新资讯28at.com

当执行部署的时候,会从 passjava 目录将 node_modules 压缩包拷贝并解压到 jenkins 的当前工作目录。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

3.3 编译代码

编译前端代码可以用 npm run build xx 命令,然后将编译后的 dist 目录压缩。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

3.4 备份代码

将 web 服务器上多个前端项目移动到备份目录 web-bak 。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

3.5 上传代码

将编译后的代码包上传到 web 服务器。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

3.6 更新代码

将 dist 压缩包解压,然后将多个前端工程拷贝到 web 目录。如 passjavabase, passjava-channel, project-contract 目录拷贝到 passjava-web-micro 目录。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

3.7 清理代码

清理 web 服务器上备份的代码。H0N28资讯网——每日最新资讯28at.com

以下命令是查找并删除指定路径下超过7天未修改的目录。H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

这条命令会找到 /nfs-data/passjava/web-bak/ 目录下所有超过7天未修改的子目录,并将其打印出来,然后删除这些目录。H0N28资讯网——每日最新资讯28at.com

  1. 查找超过7天未修改的目录:

-mindepth 1:确保查找从指定目录的子目录开始,不包括指定的根目录。H0N28资讯网——每日最新资讯28at.com

-maxdepth 1:限制查找仅在指定目录的第一层子目录中进行。H0N28资讯网——每日最新资讯28at.com

-type d:只考虑目录,不包括文件。“-type -f” 只考虑文件,不包括目录。H0N28资讯网——每日最新资讯28at.com

-mtime +7:筛选出修改时间超过7天的目录。H0N28资讯网——每日最新资讯28at.com

-print:打印出这些目录的路径。H0N28资讯网——每日最新资讯28at.com

  1. 删除找到的目录:

-exec rm -rf {} +:对找到的每个目录执行 rm -rf 命令,递归且强制删除该目录及其内容。H0N28资讯网——每日最新资讯28at.com

该步骤的完整代码如下:H0N28资讯网——每日最新资讯28at.com

图片图片H0N28资讯网——每日最新资讯28at.com

3.8 邮件通知

详见笔者之前写的一篇:持续集成:Jenkins Pipeline 邮件通知H0N28资讯网——每日最新资讯28at.com

四、总结

通过使用 Jenkins Pipeline 进行前端自动化部署,团队可以更加高效地管理和部署前端应用程序,减少人为错误和手动操作带来的风险,提升整体的开发和部署效率。H0N28资讯网——每日最新资讯28at.com

本文通过图解+代码的方式讲解了前端自动化部署的步骤,文中的脚本针对前端的三个模块进行打包,比较耗时,所以后续可以优化的地方是支持选择部署前端的不同模块。H0N28资讯网——每日最新资讯28at.com

本文链接:http://www.28at.com/showinfo-26-97298-0.html图解 Jenkins Pipeline 的前端自动化部署,用上后真香!

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com

上一篇: 一个诡异的Json反序列化问题

下一篇: C#编程中的属性与字段:何时使用以及为什么

标签:
  • 热门焦点
  • 对标苹果的灵动岛 华为带来实况窗功能

    继苹果的灵动岛之后,华为也在今天正式推出了“实况窗”功能。据今天鸿蒙OS 4.0的现场演示显示,华为的实况窗可以更高效的展现出实时通知,比如锁屏上就能看到外卖、打车、银行
  • 5月iOS设备好评榜:iPhone 14仅排第43?

    来到新的一月,安兔兔的各个榜单又重新汇总了数据,像安卓阵营的榜单都有着比较大的变动,不过iOS由于设备的更新换代并没有那么快,所以相对来说变化并不大,特别是iOS好评榜,老款设
  • 多线程开发带来的问题与解决方法

    使用多线程主要会带来以下几个问题:(一)线程安全问题  线程安全问题指的是在某一线程从开始访问到结束访问某一数据期间,该数据被其他的线程所修改,那么对于当前线程而言,该线程
  • 一篇文章带你了解 CSS 属性选择器

    属性选择器对带有指定属性的 HTML 元素设置样式。可以为拥有指定属性的 HTML 元素设置样式,而不仅限于 class 和 id 属性。一、了解属性选择器CSS属性选择器提供了一种简单而
  • 一文掌握 Golang 模糊测试(Fuzz Testing)

    模糊测试(Fuzz Testing)模糊测试(Fuzz Testing)是通过向目标系统提供非预期的输入并监视异常结果来发现软件漏洞的方法。可以用来发现应用程序、操作系统和网络协议等中的漏洞或
  • 信通院:小米、华为等11家应用商店基本完成APP签名及验签工作

    中国信通院表示,目前,小米、华为、OPPO、vivo、360手机助手、百度手机助手、应用宝、豌豆荚和努比亚等9家应用商店,以及抖音和快手2家新型应用分发平
  • 华为HarmonyOS 4升级计划公布:首批34款机型今日开启公测

    8月4日消息,今天下午华为正式发布了HarmonyOS 4系统,在更流畅的前提下,还带来了不少新功能,UI设计也有变化,会让手机焕然一新。华为宣布,首批机型将会在
  • 三星显示已开始为AR设备研发硅基LED微显示屏

    7月18日消息,据外媒报道,随着苹果首款头显产品Vision Pro在6月份正式推出,AR/VR/MR等头显产品也就将成为各大公司下一个重要的竞争领域,对显示屏这一关
  • “买真退假” 这种“羊毛”不能薅

    □ 法治日报 记者 王春   □ 本报通讯员 胡佳丽  2020年初,还在上大学的小东加入了一个大学生兼职QQ群。群主“七王”在群里介绍一些刷单赚
Top