jenkins远程部署vue项目

最新推荐文章于 2024-10-22 17:51:02 发布

weixin_39154610

最新推荐文章于 2024-10-22 17:51:02 发布

阅读量1k

点赞数 5

CC 4.0 BY-SA版权

分类专栏： linux

本文链接：https://blog.youkuaiyun.com/weixin_39154610/article/details/104560368

linux 专栏收录该内容

5 篇文章

订阅专栏

本文详细介绍使用Jenkins实现Vue项目自动化构建与部署的过程。包括在主机A上安装配置Jenkins，利用PublishOverSSH和NodeJSPlugin插件，通过npm打包Vue项目并压缩，再将压缩包发送至主机B，并在目标服务器上自动解压部署。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一：思路
主机A：安装Jenkins

#1 安装Jenkins
#2 安装插件
	Publish Over SSH 用于链接远程服务器
	NodeJS Plugin    用于打包vue项目

主机B：工程服务器
通过git将vue代码下载到主机A中，在A主机中进行npm script-run build对vue项目进行打包，对打包出来的dist目录进行 tar.gz压缩。压缩完成后将压缩包通过Publish Over SSH插件远程到主机B中，然后通过shell命令对压缩包进行解压
二：构建流程
1 系统管理➡️系统配置➡️找到SSH Servers（拉到最下面），配置远程服务器，以及项目目录在这里插入图片描述
2 新建任务（创建一个自由风格的软件项目，输入名字如 test）

3 设置git地址以及账号密码

4 构建环境（选择node）

5 执行shell（在主机A中执行）

cd /var/lib/jenkins/workspace/test #进入工程目录
npm run-script build       #运行node打包
cd dist                    #进入打包后的dist目录
rm -rf test.tar.gz         #删除原有压缩包 
tar -zcvf ypool-vue101.tar.gz *  #对新文件进行压缩
cd ../                      #回到上级目录

在这里插入图片描述
6 创建远程链接，选择Send build artifacts over SSH，让主机A链接主机B

#1 Name          : test 之前创建的SSH链接
#2 Source files  : dist/test.tar.gz 源文件（主机A）
#3 Remove prefix : dist
#4 Remote directory : /test 远程文件目录
#5 Exec command 执行shell 命令
cd /data/workplace/test   #进入项目目录
tar -zxvf test.tar.gz -C  dist/  #解压上传的压缩包,解压到dist目录中，（坑，需要提前在主机B中创建好相应的目录）
rm -rf test.tar.gz  #解压完成后，删除压缩包

在这里插入图片描述