Ionic3 自动发布

本文主要介绍使用Jenkins实现app应用的自动打包发布。每次执行jenkins任务的时候,大概流程如下:打包app应用》将app应用作为邮件附件发送给件给客户。
不管你想体验Jenkins自动化部署带来的便捷,还是学习Jenkins 自动部署 app 这门技巧,这篇文章都适合你。如果恰好你所开发的app是在内部使用的,不需要每次都通过qq还是什么方式发送给客户,Jenkins帮你一键搞定。

Jenkins安装

推荐使用简单的安装方法

下载地址:https://jenkins.io/download/ 选择下载war包

Ionic3 自动发布_第1张图片
image01.png

下载之后,准备好一个tomcat,然后将下载的war包放到 tomcat的webapps目录下,然后启动tomcat,这时候tomcat会自动解压这个war包。
在启动的过程中,会提示输入密码,这个密码我暂时不知道干嘛的,参照提示输入就好了:
Ionic3 自动发布_第2张图片
image02.png

这时候在浏览器中输入: localhost:8081/jenkins,会提示你输入密码,将命令行中的密码拷贝进去就好了。输入密码之后,进入到选择安装插件的界面,有两种方式,一种是建议安装,一种是自定义安装,直接选择建议安装。然后就是等待安装插件:
Ionic3 自动发布_第3张图片
image03.png

安装插件之后,提示创建用户:
Ionic3 自动发布_第4张图片
image04.png

创建用户之后:
Ionic3 自动发布_第5张图片
image.png

Ionic3 自动发布_第6张图片
image.png

至此Jenkins安装完成。

创建Jenkins任务

进入jenkins首页后,点击创建一个新任务。

Ionic3 自动发布_第7张图片
image.png

接下来进入到详细配置界面。

补充描述信息


Ionic3 自动发布_第8张图片
image.png

配置代码仓库,这里选择git


Ionic3 自动发布_第9张图片
image.png

省略这两个步骤


Ionic3 自动发布_第10张图片
image.png

构建


Ionic3 自动发布_第11张图片
image.png

Ionic3 自动发布_第12张图片
image.png

保存之后跳转到enkins首页,运行我们刚刚创建的任务:

Ionic3 自动发布_第13张图片
image.png

同时,可以查看日志:


Ionic3 自动发布_第14张图片
image.png

Ionic3 自动发布_第15张图片
image.png

按理来说,我们是希望可以正常的打包出一个apk文件了,但是很不巧,失败了。下面来分析一下原因。

我们知道我们的ionic项目是利用npm进行包管理的,npm是根据package.json文件安装依赖的。我们利用jenkins进行打包的时候,仅仅是从git上拉下了代码,下载需要的哪些jar包,这是一个原因。还有另外一个原因,我们打包apk文件的时候,是需要依赖SDk和安卓平台的,安卓平台我们一般是通过执行 ionic cordova platform add android 命令来添加,但是我们不可能把这个提交到git上,要不然这个项目太大了。这个时候,我们可以在 jenkins 构建的时候 执行这两个命令:
npm install 和 ionic cordova platform add android
这样确实可以,但是太慢了,每次执行 jenkins命令的时候执行上面两个命令,会浪费好多时间,得不偿失,那就找一个这折中的办法。在使用这种方法之前,先分析一下Jenkins执行 命令的 流程,这个过程可以通过日志分析出来,以下是在执行jenkins命令时候的日志:


Ionic3 自动发布_第16张图片
image.png

有这个日志就足够了,通过日志发现,jenkins有一个工作目录,在执行命令的时候创建的(第一次执行的时候创建,执行之后不会自动删除),目录的路径就是 当前用户/jenkins/任务名称。Jenkins在执行命令之前,会先从git上下载代码到这个目录,然后再执行命令。既然知道这个 那就 很简单那了 。我们可以第一次手动再这个目录下执行 npm install 和 ionic cordova pllatform add android 这两个命令,这样再打包的时候 就不会报错了。在执行这 两个 命令之后,再执行jenkins命令,通过日志可以发现,打包成功了,生成了apk文件。


Ionic3 自动发布_第17张图片
image.png

Ionic3 自动发布_第18张图片
image.png

同时,在 jenkins工作目录下,可以找到刚刚打包的apk文件。

Ionic3 自动发布_第19张图片
image.png

发送邮件设置

在 成功打包apk文件之后,希望可以将apk文件通过邮件的形式发送给客户 ,客户在邮件中直接下载附件 即可。
首先需要先配置好jenkins的邮件 发送功能。进入首页,点击系统管理:

Ionic3 自动发布_第20张图片
image.png

然后再点击 系统设置


Ionic3 自动发布_第21张图片
image.png

需要发送邮件,有这么几个选项需要配置:


Ionic3 自动发布_第22张图片
image.png

系统管理员地址其实就是发送方的邮件地址
Ionic3 自动发布_第23张图片
image.png

而且上面哪些参数一定要注意,写错一个可能就发送 失败了
image.png

可以看到邮件发送成功,说明基本的邮件发送设置完成。

项目发送邮件

邮件通知的全局设置配好以后就可以在具体的项目中应用发送邮件通知了。首先需要安装插件,在系统管理→插件管理→可选插件 搜索找到 Email Extension Plugin 安装好后,点开要配置的项目配置。

Ionic3 自动发布_第24张图片
image.png

Ionic3 自动发布_第25张图片
image.png

配置收件人地址列表


Ionic3 自动发布_第26张图片
image.png

如上,在任务构建 异常的时候就会发送邮件,为了看到效果,可以故意将上面的两个 命令写错,这样在构建的时候就会报错。
Ionic3 自动发布_第27张图片
image.png

然后执行构建任务并 查看日志


Ionic3 自动发布_第28张图片
image.png

然后去 收件箱查收邮件
Ionic3 自动发布_第29张图片
image.png

至此,项目发送发送邮件完成。

邮件全局配置

可以利用Email Extension Plugin插件全局配置发送邮件的基本配置。如果是在第一次打开jenkins主页的时候,选择安装了它建议安装的插件,那么这个插件已经有了,其它情况 不太清楚,如果没有就自己安装一下插件。配置方法如下:
首页:系统管理 》系统设置
找到Email Extension Plugin 设置

Ionic3 自动发布_第30张图片
image.png

这是基本配置,还有个高级设置,点击 “ 高级”


image.png

Ionic3 自动发布_第31张图片
image.png

这个 和 “邮件通知” 中配置保持一致就好了


Ionic3 自动发布_第32张图片
image.png

这个地方有个Default Triggers. 用来设置发送 邮件的出发条件。我的 配置 如下:
Ionic3 自动发布_第33张图片
image.png

项目引用全局配置

在项目发送邮件的时候使用刚刚的 全局配置。先打开项目配置界面:

Ionic3 自动发布_第34张图片
image.png

点击构建后操作并且选择Email Extension Plugin,如下所示:


Ionic3 自动发布_第35张图片
image.png

Ionic3 自动发布_第36张图片
image.png

Ionic3 自动发布_第37张图片
image.png

如图所示,这时候还的默认使用了 全局的一些配置。点击保存,再次测试,构建任务。当任务执行成功之后,可以在收件箱查收邮件。因此在全局配置中设置了出发条件,always、success、fail。按理来说可以收到两封邮件。


Ionic3 自动发布_第38张图片
image.png

Ionic3 自动发布_第39张图片
image.png

发现收件箱收到两封邮件,测试成功。

项目自定义配置

如果该任务不想引用全局配置,需要自己定义配置怎么办?这里也有个项目自定义功能,如图:

Ionic3 自动发布_第40张图片
image.png

点击Advanced setting 即可自定义配置。而且这里的自定义配置,是根据触发条件分别设置的:


Ionic3 自动发布_第41张图片
image.png

针对不同的触发条件,点击高级即可自定义配置了


Ionic3 自动发布_第42张图片
image.png

下面对 “success” 进行设置,每次利用jenkins打包成功后,将apk文件作为邮件的附件发送给客户
Ionic3 自动发布_第43张图片
image.png

路径的选择请参照下面的提示

保存之后执行构建任务,查看发件箱


Ionic3 自动发布_第44张图片
image.png

邮件发送成功,附件发送成功。

你可能感兴趣的:(Ionic3 自动发布)