使用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 ...
随机推荐
- Tomcat源码学习 - 环境搭建
一. 源码下载 PS: 多图预警 在开始阅读源码之前,我们需要先构建一个环境,这样才能便于我们对源码进行调试,具体源码我们可以到官网进行下载(这里我以8.5.63版本为例). 二. 项目导入 下载并解 ...
- Linux开发环境搭建——deepin系统的使用
上大学的时候就在自己的笔记本上安装过深度操作系统(deepin),当时好像是15.x的版本.毕业后第一家公司是全Mac办公,因在学校期间有过完全Linux环境下的开发体验,上手Mac非常快.非常爽.前 ...
- POJ_2387 Til the Cows Come Hom 【最短路】
一.题目 POJ2387 二.分析 Bellman-Ford算法 该算法是求单源最短路的,核心思想就是不断去更新到起点的最短距离,更新的前提是没有负边.如果有负边需要手动控制循环次数. Dijkstr ...
- Linux Python2 升级到 Python3
国内企业服务器用 CentOS 系统的比较多,CentOS8 系统已经将系统默认 Python 版本调整为了 Python3,但是 CentOS7 的存量还是很大,毕竟对企业生产服务来说稳定大于一切, ...
- 用程序员的思维了解Filecoin
程序员接触一个新技术惯用步骤: 先搜索引擎搜索一波,找个最简单的解释.如果有了个大概的概念,就前往2.否则循环1->1->1...直到有个大概的概念为止. 上官网跑一遍. 各种论坛社区溜达 ...
- 【Azure 应用程序见解】 Application Insights 对App Service的支持问题
问题描述 Web App 发布后, Application Insights 收集不到数据了 问题分析 在应用服务(App Service)中收集应用的监控数据(如Request,Exception, ...
- Vulkan移植GpuImage(二)Harris角点检测与导向滤波
Harris角点检测 UI还是用的上次扣像的,只有前后置可以用,别的没有效果,只看实现就好. 相应源码 在实现之前,我先重新整理编译glsl的生成工具,如Harris角点检测中间计算过程需要针对rgb ...
- Spring工程搭建
创建Maven项目 1.下载Maven资源包 http://maven.apache.org/download.cgi 2.打开IDEA创建Maven项目 在新建项目窗口选择Maven项目:检查当前S ...
- [源码解析] 分布式任务队列 Celery 之启动 Consumer
[源码解析] 分布式任务队列 Celery 之启动 Consumer 目录 [源码解析] 分布式任务队列 Celery 之启动 Consumer 0x00 摘要 0x01 综述 1.1 kombu.c ...
- vue篇之路由详解
一.vue路由传参的几种方式 1.声明式 router-link 父组件:<router-link :to="`/path/${id}`"><router-lin ...