作为前端leader,如何搭建属于我们公司自己的流水线自动化部署系统(node+express)

这篇具有很好参考价值的文章主要介绍了作为前端leader,如何搭建属于我们公司自己的流水线自动化部署系统(node+express)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

背景:自动化部署系统主要可以集成到公司内部的管理系统中去,比如公司有多个项目,移动端H5,大屏网站,门户网站等...每次发布或者迭代都需要前端同事打包然后在交给运维或者后端同事放到服务器上进行部署

,如果有一个项目多个同事合作完成 还要走git合并流程,所以我们的目标就是不让前端进行打包,开发完成代码后 直接提交就行,通过点击管理后台的某个按钮触发某个平台的前端项目自动更新,同时也不需要

在交付给运维或者后端,便携式与流程管理,实现自动化部署(这里只说自己实现的,当然你们也可以去接入腾讯或阿里的自动化流水部署系统,但是某些环境下只能使用自己的如何去实现)

 这里做一个简单的版本和实现代码,可以自己扩展回滚本版,本版记录等,发布人员落实在责任人等...

1.创建一个干净的express项目,写一个空接口吧下面代码放进去,调用就执行

const shell = require('shelljs');
var fs = require('fs');
var path = require('path');
const { exec } = require('node:child_process');

// 1.切换到服务器中储存的项目地址目录
const project_path = '/www/wwwroot/menghangl/public/test';
shell.cd(project_path);

// 2.删除打包的旧前端dist文件
function deleteDir(url) {
  if (fs.existsSync(url)) {
    fs.readdirSync(url).forEach(function(file, index) {
      var curPath = path.join(url, file);
      if (fs.statSync(curPath).isDirectory()) {
        // 如果是文件夹,则递归调用deleteDir函数
        deleteDir(curPath);
      } else {
        // 如果是文件,则删除文件
        fs.unlinkSync(curPath);
      }
    });
    // 删除文件夹
    fs.rmdirSync(url);
  } else {
    console.log("给定的路径不存在!");
  }
};
deleteDir('/www/wwwroot/menghangl/public/test/dist');

// 3.执行打包命令
const command = 'npm run build';
// 打包展示的进度
let schedule = 0; 
// 打包成功回调
let build = exec(command, (error, stdout, stderr) => {
  if (error) {
    console.error(`exec error打包失败: ${error}`);
    return;
  }
  schedule = 0;
  console.log('打包成功,打包结束在这里结束接口请求,或者断开长连接')
});

// 4打包进度实时显示 并输出打包步骤
build.stdout.on('data', function(data) {
 if(schedule!==100){
     console.log(`Program output 【${schedule}%】`,data)
     schedule += 20;
 } else {
     console.log(data)
 }
});

 文章来源地址https://www.toymoban.com/news/detail-825098.html

2.服务端通过git获取最新仓库内容

const shell = require('shelljs');
var fs = require('fs');
var path = require('path');
const { exec } = require('node:child_process');
//判定git命令是否可用
if (!shell.which('git')) {
    //向命令行打印git命令不可用的提示信息
    shell.echo('Sorry, this script requires git');
    //退出当前进程
    shell.exit(1);
} else {
    console.log('可以使用')
// 切换到要拉取的文件夹目录 shell.cd(
'/www/wwwroot/menghangl/public/test_git');
// 远程仓库的git命令与地址 const command
= 'git clone https://gitee.com/martins_coachman/blog-vue3-b.git'; let build = exec(command, (error, stdout, stderr) => { if (error) { console.error(`拉取失败: ${error}`); return; } console.log('拉取成功') }); }

 

3.优化与部署流程建议

上面两部分就是核心代码

1.首先先要自己部署一个node服务到服务器

2.写一个接口吧第一步骤放进去 在打包成功的地方结束请求,也可以用长连接,通过开启和关闭开实现

并且实时显示打包进度和状态

3.如果要使用git,自动同步代码,就先拉取等待拉取完成回调后,在执行打包逻辑代码

4.注意打包的时候会占用较多的cpu与内存,所以建议一个一个任务去执行,避开流量高峰期

5.解决这个的方法还有一个,就是在本地打包成功后直接git提交代码包括打包后的文件,服务器直接拉取最新代码即可

6.另外由于打包是在服务端进行,所以有时候我们开发功能添加了新的npm库 需要更新 node_modules包,建议先执行cnpm i 在去执行npm run build

7.最后可能node_modules会变的比较大 非常占用服务器硬盘空间 所以建议每次打包完成后删除 node_modules 包

 

这样就可以 用列表选择的方式在后台管理系统进行配置 动态传入不同的项目地址,远程仓库地址,执行命令等,通过后台管理系统像表单一样填写然后执行打包完成!

 

到了这里,关于作为前端leader,如何搭建属于我们公司自己的流水线自动化部署系统(node+express)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 免费搭建属于自己的域名个性邮箱

    当你已经拥有域名为 fzuenactus.org.cn的SSL证书时,你可以使用该证书来配置你的域名邮箱。以下是更详细的步骤: 1. 安装必要软件: 在终端中执行以下命令来更新系统和安装所需的软件包: 2. 配置Postfix: 编辑Postfix主配置文件: 确保以下配置正确设置: myhostname = mail.fzuenac

    2024年02月11日
    浏览(57)
  • 搭建一个属于自己的springboot项目

    最近公司要上个新系统,指定由我来带两个人进行开发,既然是新项目,那么项目搭建的事就落到我的头上了。现在都是使用springboot进行开发,为此我搭环境使用的是springboot,具体java环境如下, 使用springboot的版本是2.3.3.RELEASE。使用maven进行项目管理, 总结下,我使用到的

    2024年02月07日
    浏览(51)
  • 前端工程化:发布一个属于自己的规范 npm 包

    初始化项目 首先在github创建一个仓库,协议选择MIT,gitignore选择Node,添加README.md描述文件。使用git clone将项目克隆到本地。cd 进入目录,使用vscode打开(终端输入code . 命令即可)。 然后创建一个合理的目录结构: 配置 typescript 统一代码风格 首先,配置eslint,使用遵循Air

    2024年02月05日
    浏览(66)
  • 在笔记本上搭建一个属于自己的ChatGPT

    随着ChatGPT的流行,许多开发者想要尝试搭建一个ChatGPT服务,本文对如何在电脑上搭建进行入门。 1.安装Python和必要的库 首先,需要在你的笔记本上安装Python和必要的库。你可以从Python官方网站(https://www.python.org/downloads/)下载最新版本的Python,然后使用pip安装以下必要的库

    2024年02月11日
    浏览(47)
  • Gitbook超详细使用教程,搭建属于你自己的博客!

    Gitbook 是一个平台,允许用户创建和分享内容丰富的在线书籍。它有一个用户友好的界面,可以快速地写作、编辑和发布你的电子书。这里是一个按照 Gitbook 的基本步骤 打开GitBook官网,这里我选择使用github账号来登录,当然你也可以自己新建一个账号 点击左下角的加号,选

    2024年02月04日
    浏览(45)
  • 【快速搭建】属于自己的小店 -独角数卡-docker版本

    我选用的是docker版本的部署,至于为什么选择这个,当然是因为方便!

    2024年02月16日
    浏览(51)
  • 【Zblog搭建博客网站】windows环境搭建属于自己的博客并发布上线

    转载自cpolar极点云文章:【Zblog建站】搭建属于自己的博客网站,并内网穿透实现公网访问 想要成为一个合格的技术宅或程序员,自己搭建网站制作网页是绕不开的项目。就以笔者自己的经历来说,就被自制网页网站卡过很久。不过随着电脑技术的发展,已经出现了很多便捷

    2024年02月15日
    浏览(46)
  • 两小时搭建属于自己的chatGPT(ChatGLM)免硬件(白嫖)

    目录 准备(注册): 搭建: API模式: 测试: 总结: 注册modelscope(底层阿里云)免费使用服务器 https://modelscope.cn/ 按照图片里的选择(选择其他好像不能创建成功) 可以白嫖60多个小时的配置 8核 32GB 显存16G 预装 ModelScope Library 预装镜像 ubuntu20.04-cuda11.3.0-py37-torch1.11.0-tf1.15.5-1.5.0 Cha

    2024年02月05日
    浏览(50)
  • 如何自己制作一个属于自己的小程序?

    在这个数字化时代,小程序已经成为了我们生活中不可或缺的一部分。它们方便快捷,无需下载安装,扫一扫就能使用。如果你想拥有一个属于自己的小程序,不论是为了个人兴趣,还是商业用途,都可以通过编程或者使用免代码工具来实现。下面,我们就来探讨一下如何自

    2024年01月24日
    浏览(54)
  • 新手零基础10分钟搭建属于自己的免费AI绘画系统

    最大亮点 只需注册一个阿里云账号,通过参与利用阿里云AIGC活动,点点鼠标,全免费的搭建起属于自己的免费AI绘画系统。 步骤 1、访问这个地址:https://developer.aliyun.com/topic/aigc ,点击“立即参与”,注册登陆阿里云。 2、进入实验,选择“开通免费试用”,选择“150元额度

    2024年02月12日
    浏览(84)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包