一、业务场景

  公司前端采用微前端框架,业务按照模块区分在不同的git项目下开发,最后分别打包然后合入到一起,所以就想偷下懒,用Jenkins在本地进行打包然后合入一个文件夹,免得自己还需要一个个项目build,并且也整合了项目结构,不至于项目上线后需要对子项目再部署nginx

二、环境

系统 widows
java 17.0.10
Jenkins 2.440.1
注:在windows上装,java和Jenkins的包尽量还是用新的,java8都找不到老版本的Jenkins.msi包了

Jenkins安装后建议改一下工作区,因为Jenkins就算你选择安装在D盘,但是还是会在C盘生成文件夹Jenkins,具体操作看这里

三、给Jenkins添加nodejs插件

1、在Manage Jenkins 页面选择Plugins

在这里插入图片描述

2、选择Available plugins页面,里面搜索nodejs,然后勾选安装

在这里插入图片描述

3、在Manage Jenkins 页面选择Tools,下拉到底部,点击nodejs安装

在这里插入图片描述

4、新增node版本,跟自己项目版本一致

在这里插入图片描述

四、新建主项目

1、工作台首页点击“新建Item”

在这里插入图片描述

2、输入项目名称,然后选择FreeStyle project

在这里插入图片描述

3、General 勾选 Discard old builds

![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/2a5a9e4cb44942a198c55d10925bbf35.png

4、源码管理选择Git,然后填上代码的git地址和分支

在这里插入图片描述

5、构建环境选择Provide Node & npm bin/ folder to PATH,然后选择node版本

在这里插入图片描述

6、Build Steps中添加构建步骤,选择Execute Windows batch command(windows选这个)

分别执行以下命令:
  1.rd /q /s D:\jenkins\workspace\main (主项目编译时执行此命令,如果存在mian目录就先删掉,因为后续所有项目编译完成后都移动到此目录下)
  2.npm install
  3.npm run build
  4.move dist ../main (移动打包后的文件并重命名为main文件夹)
在这里插入图片描述

五、新建子项目

1、新建子项目,操作步骤如上

2、git地址填入子项目的地址

3、构建触发器选择Build after other projects are built,并填入主项目的名字

在这里插入图片描述

4、构建环境添加方式跟主项目一致

5、构建步骤添加以下命令

  1.npm install
  2.npm run build
  3.move dist ../main/child (将子项目打包后的文件移动到main下并重命名)
在这里插入图片描述
注:构建后会在jenkins\workspace文件夹中生成一个main文件夹,里面包含了主项目及子项目的代码
如果不想放在workspace下,就修改move命令的第二个参数

六、结束

1、打包完成后效果,child文件夹中就是子项目代码
在这里插入图片描述

2、如果有多个子项目就重复新建子项目的步骤就行

Logo

瓜分20万奖金 获得内推名额 丰厚实物奖励 易参与易上手

更多推荐