Jenkins集成Gulp实现前端自动发布

一种方式是在本地(也就是Jenkins所在服务器)安装nodejs以及gulp,并在workspace中执行shell/cmd,实现前端代码的打包集成,然后通过SSH发送至目标服务器。

另一种方式是在Jenkins中安装nodejs的插件,通过插件进行打包操作。在Jenkins服务器上也会进行nodejs安装,但这次的安装仅限于Jenkins中使用,本地是无法进行的(疑似原因是没有进行本地PATH配置,Jenkins在使用插件时会使用自己的配置路径/临时将路径加入PATH,实现手段没有仔细研究)。

因为觉得本地安装nodejs及gulp太麻烦,于是选择了第二种使用插件的方式。(结果遇到了坑)

一、安装NodeJS Plugin

Jenkins-系统管理-插件管理(pluginManager)-可选插件

搜索NodeJS Plugin

安装,选择自动安装(如果此时你在Jenkins本地已经安装了nodejs,也可以不选自动安装,直接在安装目录中填写本地安装路径)

选项中可以安装Global npm pakcages to install 也就是安装nodejs相关的其它插件(比如bower gulp)

《Jenkins集成Gulp实现前端自动发布》 在线安装
《Jenkins集成Gulp实现前端自动发布》 本地安装

二、在Job中应用

在构建环境流程时可以选择使用node环境配置

《Jenkins集成Gulp实现前端自动发布》 构建环境

三、构建执行语句

这里有一点要注意,如果Jenkins服务器是Linux系统(网上大部分文章都是),那么可以直接选择Execeute Shell即可。如果比较小众的使用了Windows系统,会提示错误

The system cannot find the file specified
FATAL: command execution failed
java.io.IOException: CreateProcess error=2, 系统找不到指定的文件。
    at java.lang.ProcessImpl.create(Native Method)
    at java.lang.ProcessImpl.(Unknown Source)
    at java.lang.ProcessImpl.start(Unknown Source)
Caused: java.io.IOException: Cannot run program “sh”

那么有两个方案:(https://stackoverflow.com/questions/15135771/hudson-on-windows-error-java-io-ioexception-cannot-run-program-sh)

1、Execute Shell + 修改Jenkins配置(未测试)

Manage Jenkins -> Configure System -> Shell, set the shell path as C:\Windows\system32\cmd.exe

2、选择”Execute Windows batch command”(测试成功)

执行内容就是最直接的

gulp build

四、出现了错误!

(1)原本在执行内容中加入了gulp -v作为测试,结果显示

‘gulp’ 不是内部或外部命令,也不是可运行的程序 或批处理文件。

原因:没有安装gulp,于是在NodeJS Plugin里进行gulp的安装

(2)gulp -v成功!但是——

[14:18:55] Local gulp not found in D:\Jenkins\workspace\**************
[14:18:55] Try running: npm install gulp

无法找到gulp,可是gulp -v已经成功了啊……

那我不直接执行gulp build,用nodejs gulpfile.js呢?

Error: Cannot find module ‘gulp’
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
    at Function.Module._load (internal/modules/cjs/loader.js:507:25)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:20:18)

还是找不到

重新查找gulp安装及使用的说明,发现原来gulp分为全局安装和本地安装两种,本地安装必须在当前工程下进行,本地的gulp是专属于这个工程的,只有它才能对代码进行编译打包,全局gulp不行。(具体原因参见:https://stackoverflow.com/questions/22115400/why-do-we-need-to-install-gulp-globally-and-locally)有一种说法是为了你的工程被移植到其他地方时,如果用新服务器的全局gulp可能出现版本、配置等问题,于是就需要本地也有一份gulp,连同源码一并移植。

五、gulp本地安装

1.创建npm link或软链接(未测试)

2.用命令行本地创建吧

npm install gulp –save-dev && gulp build

问题在于安装之后会生成node_modules,但是每一次从svn上更新代码这个文件夹都会被删掉(workspace的清除功能),相当于每次都重新安装,代价也太大了……

六、不删除的SVN更新

Jenkins提供了五种SVN的更新方式,详见(http://blog.51cto.com/zhangxingnan/1427000),之前选择了Emulateclean checkout by first deleting unversioned/ignored files,then ‘svn update’,因此每次都会清空workspace,换成Use‘svn update’ as much as possible就可以了

《Jenkins集成Gulp实现前端自动发布》 Check-out Strategy 代码检出策略http://blog.51cto.com/zhangxingnan/1427000

但是要注意的是第一次检出还是要安装一次,所以我的策略是先在Jenkins里install一遍,再把配置改掉,只执行gulp就好了。

七、遗留问题

1、如果采用npm link或软链接方式,也许就不用再本地安装gulp,待测试

2、gulp生成的目标文件夹destination原本在SVN上也有一份,所以如何在从SVN上检出时跳过destination文件夹不检出呢……尝试过源码管理-高级里的Exclude Region但是没有效果,待验证

    原文作者:康加罗
    原文地址: https://www.jianshu.com/p/88fe332cf0e0
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞