使用jenkins一键打包发布vue项目
jenkins的安装
Jenkins是一款开源 CI&CD 软件,用于自动化各种任务,包括构建、测试和部署软件。
Jenkins 支持各种运行方式,可通过系统包、Docker 或者通过一个独立的 Java 程序。
安装
这里的操作系统为WSL Ubuntu,其它系统的安装的请参考jenkins官方文档
wget -q -O - https://pkg.jenkins.io/debian/jenkins.io.key | sudo apt-key add -
sudo sh -c 'echo deb http://pkg.jenkins.io/debian-stable binary/ > /etc/apt/sources.list.d/jenkins.list'
sudo apt-get update
sudo apt-get install jenkins
更换端口号(默认运行在8080端口)
jenkins的配置文件在 /etc/default/jenkins
;在其中找到HTTP-PORT
并修改
运行
sudo systemctl start jenkins
# OR
sudo service jenkins start
如果要开机自动运行
sudo systemctl enable jenkins
如果运行时碰到如下图的错误,请先安装jdk
基础配置
启动成功后输入对应的地址(ip:port)
进入jenkins管理界面
-如下图
在上图中红色字体对应的文件
中拿到默认的管理员密码-具体命令
cat /var/lib/jenkins/secrets/initialAdminPassword
命令执行完成后返回如下图
输入密码之后进入到自定义Jenkins
界面(如下图)
在此界面我们选择安装推荐的插件
就会开始安装插件;如下图
插件安装完成后
就会自动进入设置用户名密码
界面(如下图)
输入完成后点击按钮保存并完成
就会进入下一个界面实例配置
点击按钮保存并完成
就进入一个新界面,再点击其中的按钮开始使用Jenkins
就进入了jenkins的主界面
(如下图),至此就完成了jenkins的安装与基础配置。
发布vue项目
> 打包vue项目需要nodejs,打包完成后需要通过ssh把打包好的文件上传到目标服务器上。所以下面我们将会来安装jenkins的nodejs插件和Publish Over SSH插件。
安装插件-nodejs
在jenkins主界面工作台
,依次点击系统管理>插件管理
进入插件管理界面(如下图)
搜索结果如下图
勾选完插件并点击安装后进入到插件下载界面(如下图)
配置nodejs插件
在jenkins主界面工作台
,依次点击系统管理>全局工具设置
进入插件管理界面并找到NodeJs选项(如下图)
安装Publish Over SSH
插件并配置
Publish Over SSH
插件的安装和nodejs插件
是一样,安装完成后开始配置插件;
在jenkins主界面工作台
,依次点击系统管理>系统配置
进入插件配置界面,滚动到Publish over SSH
的位置,然后点击SSH Servers
下面的新增按钮
(如下图)
点击按钮高级
后出现的界面如下
创建任务
至此,打包vue所需的jenkins插件都已经安装完成,下面我们开始创建vue项目打包的任务。
具体操作如下图
点击按钮确定
后,如下图
安装上图所说的配置完成后点击保存
按钮就会跳转到所创建任务的详情界面。
至此一个我们便实现了一个简单的一键打包前端项目的jenkins配置。
如有疏漏,欢迎指出
您的点赞就是对我最大的认可。
使用jenkins一键打包发布vue项目的更多相关文章
- 【linux】【jenkins】自动化运维三 整合gitlab、docker发布vue项目
由于工作需要,这里我先创建一个vue的工程. 1.首先安装好gitlab相关插件:GitLab.GitLab Hook.NodeJS 插件安装参考:https://www.cnblogs.com/jx ...
- Ant自动编译打包&发布 android项目
Eclipse用起来虽然方便,但是编译打包android项目还是比较慢,尤其将应用打包发布到各个渠道时,用Eclipse手动打包各种渠道包就有点不切实际了,这时候我们用到Ant帮我们自动编译打包了. ...
- Andorid进阶7—— Ant自动编译打包&发布 android项目
http://www.cnblogs.com/tt_mc/p/3891546.html Eclipse用起来虽然方便,但是编译打包android项目还是比较慢,尤其将应用打包发布到各个渠道时,用Ecl ...
- HBuilder打包app(vue项目)
一.测试项目是否可以正确运行 指令:npm run dev 首先我们先建立一个vue的项目,本人用的是vue-cli随便建立的,然后运行项目 不必非得是像我这样的,这一步的目的只是测试一下咱们的 ...
- .NetCore 利用Jenkins在 Windows平台下打包发布Angular项目
准备环境 安装Jenkins 首先装node,版本根据实际环境而定(node安装包中包含了npm) 安装一般都配置好了环境变量,检查下如果没有就配置下 Jenkins中安装NPM插件 GIt获取代码 ...
- 配置Jenkins 实现自动发布maven项目至weblogic(svn+maven+weblogic12c)
Jenkins安装完成之后,需要我们对其配置,然后才可以实现自动部署项目. 前提 防火墙开放weblogic的7001端口 Linux(CentOS):firewall-cmd --zone=publ ...
- Windows下配置Jenkins 实现自动发布maven项目至tomcat(svn+maven+tomcat)
Jenkins安装完成之后,需要我们对其配置,然后才可以实现自动部署项目. 前提 防火墙开放tomcat的8080端口 Linux(CentOS):firewall-cmd --zone=public ...
- jenkins按版本发布maven项目
1.先为java这个项目创建三个版本 vim pom.xml vim src/main/java/com/ghz/testweb/App.java git add . git commit -m &q ...
- jenkins git ftp 发布.net 项目
一次搞这个,在其他文章的基础上 添加下自己的 笔记,方便自己查看, -------需要准备的东西--------------- 下载jenkins https://jenkins.io/downloa ...
随机推荐
- Apache配置 11. 访问控制-user_agent
(1)介绍 user_agent是指用户浏览器端的信息.比如你是用IE的还是Firefox浏览器的.有些网站会根据这个来调整打开网站的类型,如是手机的就打开wap,显示非手机的就打开PC常规页面. ( ...
- 基于renren-fast的快速入门项目实战(实现报表增删改查)
基于renren-fast的快速入门项目实战(实现报表增删改查) 说明:renren-fast是一个开源的基于springboot的前后端分离手脚架,当前版本是3.0 官方开发文档需付费,对于新手而言 ...
- Go语言中使用K8s API及一些常用API整理
Go Client 在进入代码之前,理解k8s的go client项目是对我们又帮助的.它是k8s client中最古老的一个,因此具有很多特性. Client-go 没有使用Swagger生成器,就 ...
- [系统重装日志2]win10系统安装pytorch0.4.1(gpu版本)
目录 0,资源整理 1,安装最新版的显卡驱动 2,安装visual studio 3,安装cuda 4,安装cudnn,配置环境变量 5,安装pytorch 6,安装torchvision 7,验证 ...
- SqlServer存储过程的创建与使用
什么是存储过程? T-SQL中的存储过程,非常类似于net语言中的方法,它可以重复调用.当存储过程执行一次后,可以将语句缓存中,这样下次执行的时候直接使用缓存中的语句. 这样就可以提高存储过程的性能. ...
- 全网最详细的Linux命令系列-rm命令
今天学习一下linux中删除文件和目录的命令: rm命令.rm是常用的命令,该命令的功能为删除一个目录中的一个或多个文件或目录,它也可以将某个目录及其下的所有文件及子目录均删除.对于链接文件,只是删除 ...
- 解决wampserver 服务无法启动
如图左击选中apache的httpd.conf把文本中的80端口,改成未被占用的端口.
- [GDKOI2021] 普及组 Day3 总结 && 题解
[ G D K O I 2021 ] 普 及 组 D a y 3 总 结 时间安排和昨天的GDKOI2021 Day2一样. 早上四个小时的快乐码题时间,然鹅我打了半小时的表 然后就是下午的题目讲解和 ...
- elementui 表格 如何使操作中隐藏一个按钮
<el-table-column label="权限"min-width="100"> <template scope="scope ...
- 学习笔记-angular 使用uuid
import { UUID } from 'angular2-uuid'; let uuid = UUID.UUID().replace(/-/g, '').toLocaleUpperCase(); ...