当前位置: 首页 > news >正文

Jenkins上面使用pnpm打包

问题

前端也想用Jenkins的CI/CD工作流。

步骤

Jenkins安装NodeJS插件

NodeJS
安装完成,记得重启Jenkins。

全局配置nodejs

全局nodejs配置

Jenksinfile

pipeline {agent anytools {nodejs "18.15.0"}stages {stage('Check tool version') {steps {sh '''node -vnpm -vnpm config ls'''}}stage('Build Preparation') {steps {sh '''corepack enable pnpmpnpm i'''}}stage('Build') {steps {script {if (env.BRANCH_NAME.startsWith('develop')){sh '''pnpm run build:dev'''} else if (env.BRANCH_NAME.startsWith('uat')){sh '''pnpm run build:uat'''} else {echo 'Skipping pnpm run.'}}}}stage('S3 Sync') {steps {script {if (env.BRANCH_NAME.startsWith('release')){sh '''aws s3 sync ./dist/ s3://prod-web-xxxx/ --exclude "xxxx/*" --exclude "h5/*" --delete'''} else if (env.BRANCH_NAME.startsWith('uat')){sh '''aws s3 sync ./dist/ s3://uat-web-xxxx/ --exclude "xxxx/*" --exclude "h5/*" --delete'''} else {echo 'Skipping S3 Sync.'}}}}stage('CDN invalidation') {steps {script {if (env.BRANCH_NAME.startsWith('release')){sh '''aws cloudfront create-invalidation --distribution-id XXXX --paths '/*''''} else if (env.BRANCH_NAME.startsWith('uat')){sh '''aws cloudfront create-invalidation --distribution-id xxxx --paths '/*''''} else {echo 'Skipping CDN invalidation.'}}}}}
}

这里的18.15.0必须与上一步中Jenkins安装的NodeJS名称一致。这里还涉及到将文件上传到s3桶和刷新CDN的过程。

创建Jenkins多分支项目

创建入口页面
创建多分支流水线
设置git源
这里设置git源复制一点点,最后,保存应用。

S3同步部署文件权限(可选)

我这里用的是AWS云,所以,这里需要对运行的Jenkins需要设置相关权限。

{"Version": "2012-10-17","Statement": [{"Sid": "ListObjectsInBucket","Effect": "Allow","Action": ["s3:ListBucket"],"Resource": ["arn:aws:s3:::dev-xxx"]},{"Sid": "AllObjectActions","Effect": "Allow","Action": "s3:*Object","Resource": ["arn:aws:s3:::dev-xxx/*"]}]
}

CloudFront刷新权限(可选)

{"Version": "2012-10-17","Statement": [{"Sid": "VisualEditor0","Effect": "Allow","Action": "cloudfront:CreateInvalidation","Resource": "arn:aws:cloudfront::xxxxxxx:distribution/xxxxxxx"}]
}

总结

到这里Jenkins打包前端的工程就结束了。aws cli挺好用的,要是Jenkins出个官方插件就好了。

参考

  • NodeJS
  • CI/CD Pipeline for a NodeJS Application with Jenkins
http://www.lryc.cn/news/340169.html

相关文章:

  • 设计编程网站集:动物,昆虫,蚂蚁养殖笔记
  • 面经学习(众智宏图实习)
  • DataGrip2024安装包(亲测可用)
  • 【InternLM 实战营第二期-笔记4】XTuner 微调个人小助手认知
  • <计算机网络自顶向下> CDN
  • 【Git教程】(十二)工作流之项目设置 — 何时使用工作流,工作流的结构,项目设置概述、执行过程及其实现 ~
  • Java 排序算法
  • 【重磅更新】开源表单系统填鸭表单v5版发布!
  • 保姆级教程 | Adobe Illustrator 中插入数学符号
  • 数据结构——双向循环链表
  • 使用ZLMediaKit搭建服务器实现推流拉流
  • 【拦截器Interceptor】springboot拦截器的使用和原理
  • Android12 user版本无法进入recovery问题
  • Android沙盒机制
  • 【C++】每日一题 290 单词规律
  • CSS3 animation-direction 属性
  • 【mysql 5.7 没有ini 文件,手动添加配置文件】
  • 【Python】从零开始学习Python中的随机模块:实现验证码生成功能
  • 游戏动画技术:从传统到深度学习
  • Github 2024-04-12 开源项目日报 Top10
  • 若依下整合多个Redis
  • SRTP + RTCP + SCTP
  • 每日一题 — 串联所有单词的子串
  • Android studio顶部‘app‘红叉- Moudle ‘XX.app’ dosen’t exist in project
  • 软考证书有用吗?软考证书的含金量大吗?
  • 自动化测试原理,怎么理解?【UI自动化】
  • typedef,#define,asserr,exit函数,free函数
  • Linux的重要命令(二)+了解Linux目录结构
  • nmap使用
  • 简约风好看的个人主页源码