使用Jenkins一键发布前端vue项目

前端项目用Tomcat服务器跑

使用Jenkins自动编译部署web应用
Jenkins安装与配置
Jenkins运行在Linux服务器上,尝试在此服务器上编译并部署一个web应用,编译过程需要node环境,编译后文件需ssh到测试服务器
Jenkins主要完成任务如下:
1、自动集成编译环境
2、线上编译应用
3、ssh到目标环境并运行

Jenkins安装node环境,先下载Linux版本64位的

然后放到Jenkins上(用xftp上传,上传服务器可以是自己任意路径,目前我的放置路径为cd /home/mcbadm/env/vue-dev/node/nodejs)

然后解压xz xxx.tar.xz
① tar -xvf node-v6.10.0-linux-x64.tar.xz //解压
② mv node-v6.10.0-linux-x64 nodejs //移动你建的目录
③确认一下nodejs下bin目录是否有node 和npm文件,如果有执行软连接,如果没有重新下载执行上边步骤; //可以通过node -v和
3)建立软连接,变为全局
①ln -s /home/mcbadm/env/vue-dev/node/nodejs/bin/npm /usr/local/bin/
②ln -s /home/mcbadm/env/vue-dev/node/nodejs/bin/node /usr/local/bin/
4)检验nodejs是否已变为全局 node -v

新建一个Job
1、点击左上角的【新建】,创建一个新任务

2、填写任务名称

配置编译环境
基于node的编译环境
关于安装node,一般可以下载执行文件安装或编译源码安装,而通过Jenkins,我们则可考虑使用其提供的插件进行自动安装

1、选择系统管理->管理插件

2、可以看到,Jenkins提供了丰富的插件供开发者使用,找到我们需要的[NodeJS Plugin],勾选后点击安装即可

3、安装完毕后,选择系统管理->Global Tool Configuration,配置node下载及安装
4、保存完毕后,通过列表,进入刚刚新建的Job,找到【构建环境】,勾选Provide Node & npm bin/ folder to PATH,选择刚刚添加的配置即可;此后当每次build,都会首先执行环境构建,环境构建无误后,才会开始真正的构建过程

总图:

//Execute shell Command

npm run build //build

cd dist //进入build完的文件夹
if [ ! -f “dist.tar.gz” ];then //判断有没有存在dist.tar.gz,有删掉,没有输出不存在
echo “文件不存在”
else
rm -f dist.tar.gz //有存在dist.tar.gz ,则删掉,每次进来先删掉,则不会留下上一次的旧文件
fi //if 的结束语句
tar zcvf dist.tar.gz * //把dist 文件夹打包为tar.gz

rm -rf /home/mcbadm/app/html/htmlTomcat/webapps/ROOT/* //删除ROOT下所有文件
tar zxvf /home/mcbadm/temp/vue-web/dist.tar.gz -C /home/mcbadm/app/html/htmlTomcat/webapps/ROOT
//把服务器上temp目录下的tar包解压到开发环境的正式路径下
rm /home/mcbadm/temp/vue-web/dist.tar.gz //删除服务器上temp目录下的tar包

保存后,点立即构建

发布了67 篇原创文章 · 获赞 8 · 访问量 6355

猜你喜欢

转载自blog.csdn.net/qq_34425377/article/details/93881338