CI_CD

什么是CI/CD

在前端开发中,CI/CD 是 Continuous Integration(持续集成)和 Continuous Deployment/Continuous Delivery(持续部署/持续交付)的简称。它是一种软件开发实践,自动化了应用的构建、测试和发布过程。

CI/CD的作用

  1. 持续集成(CI):当开发者将代码推送到版本控制系统(如 GitHub、GitLab)时,CI 工具会自动构建和测试应用代码,以确保代码没有引入新的问题。前端代码在此过程中会进行:
  • 自动化单元测试和集成测试
  • 代码质量检查(如 ESLint)
  • 编译和构建打包(例如 Webpack 或 Vite)
  1. 持续部署/持续交付(CD)
  • 持续交付:构建和测试通过后,代码自动发布到一个准备好的环境中(如 staging 环境)进行手动审核,之后再发布到生产环境。
  • 持续部署:代码通过测试后,自动部署到生产环境,使更新可以快速上线。对于前端,这通常会将最新的代码发布到 Web 服务器或 CDN。

实现CI/CD

1.1 编写配置文件

// 配置
const config = [{name: '项目1',value: '项目1',ssh: {host: 'xxxx',port: 'xxxx',username: 'xxxx',password: 'xxxx',passphrase: 'xxxx'},targetDir: 'G:/桌面/code/xmzs/cicd-project/dist',targetFile: 'dist.zip',deployDir: '/www/wwwroot/',releaseDir: 'web',buildCommand: 'pnpm build'}
]export default config

配置文件为什么是一个数组呢?

因为可以支持多个项目上传不同的服务器

1.2 编写程序入口

function main() {}main()

1.3 读取配置文件的内容

有了入口之后,我们只需要使用node启动就可以完成程序的运行。有了配置文件之后,我们需要读取其中的配置完成后续的动作,那么,我们要怎么读取配置文件的内容呢?。我们可以采用命令行的方式来读取。因此,我们需要安装inquirer这个库。

// 命令行交互工具
import inquirer from "inquirer";
import config from "../config.js";async function commanderLine () {const res = await inquirer.prompt([{type: 'list',message: '请选择项目',name: 'project',choices: config}])return config.find(item => item.value === res.project)
}export default commanderLine

通过以上函数,可以实现一下效果:

1.4 压缩

那么,我们可以根据命令行获取的路径参数对需要上传到服务器的文件夹进行压缩,需要用到archiver这个库来对目录进行压缩。

// 编写压缩文件的代码
import archiver from 'archiver'
import fs from 'fs'
/*** * @param {*} targetDir 压缩的目录的位置* @param {*} localFile 压缩之后压缩包存放的位置*/
function compressFile (targetDir, localFile) {return new Promise(resolve => {// 创建可写流const output = fs.createWriteStream(localFile)const archive = archiver('zip', {zlib: { level: 9 }})archive.pipe(output)archive.directory(targetDir, 'dist')archive.finalize()archive.on('close', () => {console.log((archive.pointer() / 1024 / 1024).toFixed(2), 'MB')resolve()})})
}export default compressFile

1.5 使用ssh连接远程服务器

为了连接远程服务器,我们可以使用node-ssh这个库来完成

// 连接ssh服务
import * as ssh from 'node-ssh'const sshClient = new ssh.NodeSSH()function sshConnect (sshConfig) {return new Promise(resolve => {sshClient.connect(sshConfig).then(res => {console.log('connect success')resolve(res)})})
}export default {sshConnect,ssh: sshClient
}
import service from './src/ssh.js'
async main() {...await service.sshConnect(options.ssh)
}

1.6 上传文件

// 上传远端服务器的代码
// local表示需要上传的目录
// config.deployDir + config.releaseDir表示上传到服务器的目录的路径
function uploadFile (ssh, config, local) {return new Promise(resolve => {ssh.putFile(local, config.deployDir + config.releaseDir).then(() => {console.log('upload success')resolve()}).catch(err => {console.log(err)})})
}export default uploadFile

通过以上步骤,已经基本实现文件的上传,但是目前我们上传的是一个压缩包,因此需要对他进行解压,还有就是现在只能上传一次,因为服务器不允许同名文件出现,因此我们第二次上传时需要将上一次上传的给删掉。但是我们要怎么删除呢?

  1. 可以使用linux命令
  2. node-ssh提供了执行linux命令的方法
// 操作ssh命令的文件
function runCommander (ssh, command, path) {return new Promise(resolve => {ssh.execCommand(command, { cwd: path }).then((result) => {resolve()})})
}export default runCommander

通过以上方法,我们可以完成对linux命令的执行

  1. rm -rf 完成对原先文件的删除
  2. unzip 完成对压缩包的解压
  3. mv 完成对文件的重命名

1.7 执行对于需要上传的文件的打包

当我们对项目进行修改时,服务器上的内容并没有更新,因为我们并没有对其进行重新打包,因此我们还需要在上传文件到服务器之前对项目进行重新打包。那么,要如何在执行main脚本的同时执行项目的打包脚本呢?我们可以使用node的原生模块child_process子进程。

import { execSync } from 'child_process'
function runBuild (path, command) {return new Promise(resolve => {execSync(command, {cwd: path,stdio: 'inherit'})resolve()})
}export default runBuild

通过以上函数,我们可以完成对项目的打包。

1.8 最终的启动文件

import commanderLine from './src/helper.js'
import compressFile from './src/compressFile.js'
import service from './src/ssh.js'
import uploadFile from './src/uploadFile.js'
import runCommander from './src/handleCommand.js'
import path from 'path'
import runBuild from './src/build.js'
async function main () {const options = await commanderLine()const local = path.join(process.cwd(), options.targetFile)await runBuild(options.targetDir, options.buildCommand)await compressFile(options.targetDir, local)await service.sshConnect(options.ssh)await runCommander(service.ssh, `rm -rf ${options.releaseDir}`, options.deployDir)await uploadFile(service.ssh, options, local)await runCommander(service.ssh, `unzip ${options.releaseDir}`, options.deployDir)await runCommander(service.ssh, `rm -rf ${options.releaseDir}`, options.deployDir)await runCommander(service.ssh, `mv dist ${options.releaseDir}`, options.deployDir)service.ssh.dispose() // 断开ssh
}
main()

最终,我们只需要执行node app.js就能完成对项目的打包以及部署到服务器了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/4419.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

设置JAVA以适配华为2288HV2服务器的KVM控制台

华为2288HV2服务器比较老旧了,其管理控制台登录java配置比较麻烦,华为的ibmc_kvm_client_windows客户端测试了几个版本,连接控制台也有问题,最终安装JDK解决。 一、测试环境 主机为WindowsServer2012R2,64位系统 二、Java软件包…

机器学习—构建一个神经网络

如何在Tensorflow中构建神经网络? 回到之前的例子,如果你想做钱进支柱,初始化数据x创建第一层,如下图所示计算一个1,然后创建第二层并计算一个2,所以这是一种明确的向前推进的方式。 事实证明,…

基于51单片机的步进电机定时控制proteus仿真

地址: https://pan.baidu.com/s/1_F5bfyS_e_eKSblnja7RqA 提取码:1234 仿真图: 芯片/模块的特点: AT89C52/AT89C51简介: AT89C52/AT89C51是一款经典的8位单片机,是意法半导体(STMicroelectro…

【云原生开发】如何通过client-go来操作K8S集群

✨✨ 欢迎大家来到景天科技苑✨✨ 🎈🎈 养成好习惯,先赞后看哦~🎈🎈 🏆 作者简介:景天科技苑 🏆《头衔》:大厂架构师,华为云开发者社区专家博主,…

idea 配置自动导入设置

配置自动导入设置: 通过访问 Settings→Editor→General→Auto Import,勾选 Add unambiguous imports on the fly 和 Optimize imports on the fly 选项,可以实现自动添加明确的导入和快速优化导入,即自动删除无用的导入

【文本情感分析识别】Python+SVM算法+模型训练+文本分类+文本情感分析

一、介绍 使用Python作为开发语言,基于文本数据集(一个积极的xls文本格式和一个消极的xls文本格式文件),使用Word2vec对文本进行处理。通过支持向量机SVM算法训练情绪分类模型。实现对文本消极情感和文本积极情感的识别。并基于D…

iptables面试题

1、详述iptales工作流程以及规则过滤顺序? iptables过滤的规则顺序是由上至下,若出现相同的匹配规则则遵循由上至下的顺序 2、iptables的几个表以及每个表对应链的作用? Iptables有四表五链 Filter表 : Filter表是iptables中使用的默认表…

【青牛科技】GC2803:白色家电与安防领域中 ULN2803 的卓越替代者

在当今科技飞速发展的时代,电子元器件在各个领域都扮演着至关重要的角色。在白色家电和安防等产品的电路设计中,驱动芯片的选择尤为关键。传统的 ULN2803 曾是广泛应用的一款芯片,但如今,芯麦 GC2803 的出现为这些领域带来了新的选…

变脸、看完毒液3,我把自己的脸变毒液了,视频有点惊悚!请谨慎观看

大家好,我是Shelly,一个专注于输出AI工具和科技前沿内容的AI应用教练,体验过300款以上的AI应用工具。关注科技及大模型领域对社会的影响10年。关注我一起驾驭AI工具,拥抱AI时代的到来。 AI工具集1:大厂AI工具【共23款…

数据分析:微生物功能差异分析之Maaslin2

文章目录 介绍加载R包数据链接导入数据数据预处理Maaslin2检验输出结果画图系统信息介绍 Maaslin2(Microbiome Multivariable Associations with Linear Models)是一种用于微生物组学数据的多变量关联分析工具。它的原理和特点如下: 多变量关联分析: Maaslin2旨在高效确定…

电脑软件:推荐四款非常好用的电脑磁盘分析工具

一、WizTree WizTree 是一款Windows下磁盘空间分析工具。它可以快速扫描并分析你的电脑硬盘驱动器中文件和文件夹,并以可视化块状的方式展示哪些文件和文件夹使用的磁盘空间最多。这样你就可以很方便找到占用磁盘空间大的文件。 WizTree的特点 ● 磁盘空间利…

6. STM32之TIM实验--编码器接口()--(实验5:PWM驱动直流电机)

这篇文章是通用定时器的最后一章节,也就是编码器接口,主要是用来进行对精确测量旋转角度或速度的负载进行精确控制。 STM32 编码器模式详解-CSDN博客 STM32——编码器测速原理及STM32编码器模式_龙邱512编码器stm32历程-CSDN博客 代码可根据这个进行编…

如何批量创建文件夹并命名?6个一键批量创建的方法

如何批量创建文件夹并命名?在快节奏的现代工作环境中,时间成为了最宝贵的资源。面对海量的数据与文件,如何高效地组织与管理,成为了提升工作效率的关键。为了节省时间,批量创建文件夹并命名,成为了一项至关…

人工智能之人脸识别(face_recognition)

文章目录 face_recognition 介绍主要功能**与opencv联系联系检测人脸切割人脸提取人物关键特征计算人脸的欧几里得距离计算人脸匹配程度总结 face_recognition 介绍 face_recognition 介绍 face_recognition 是一个非常流行的 Python 库,专门用于人脸识别任务。它基…

Java学习路线:JUL日志系统(二)使用Properties配置文件

目录 认识properties 使用properties编写日志配置文件 认识properties 之前的学习中,我们学习了使用XML配置文件,但是XML的读取实在有些麻烦。那有没有更简单的方式来配置文件呢? 答案是:使用Properties配置文件 在这里了解pro…

【数据库】elasticsearch

1、架构 es会为每个索引创建一定数量的主分片和副本分片。 分片(Shard): 将索引数据分割成多个部分,每个部分都是一个独立的索引。 主要目的是实现数据的分布式存储和并行处理,从而提高系统的扩展性和性能。 在创建索…

Qt——常用控件

前言:本篇文章,将分享Qt中常用的,具有代表性的一些控件。 一.按钮类控件 在前边的文章中我们也多次分享过PushButton按钮,但Qt中并非只提供这一种按钮。 在Qt中,QPushButton并非直接继承自QWidget,QAbstr…

硬件基础06 滤波器——无源、有源(含Filter Solutions、Filter Pro、MATLAB Fdatool)

推荐设计RC无源滤波器使用,数字滤波器可以使用MATLAB,有源滤波器使用Filter Pro。 一、Filter Solutions 1、软件资源及安装教程如下 FilterSolutions14.1.rar资源 (1)、双击FS14_1_0.exe进行安装;不要安装到中文路…

js WebAPI黑马笔记(万字速通)

此笔记来自于黑马程序员,pink老师yyds 复习: splice() 方法用于添加或删除数组中的元素。 注意: 这种方法会改变原始数组。 删除数组: splice(起始位置, 删除的个数) 比如:1 let arr [red, green, b…

docker安装低版本的jenkins-2.346.3,在线安装对应版本插件失败的解决方法

提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言一、网上最多的默认解决方法1、jenkins界面配置清华源2、替换default.json文件 二、解决低版本Jenkins在线安装插件问题1.手动下载插件并导入2.低版本jenkins在…