Jenkins在linux上的安装教程:http://www.ityouknow.com/springboot/2017/11/11/springboot-jenkins.html

  另外,关于在windows上的安装请自行百度...

  下面贴下Jenkins构建前端Vue项目的配置:

  新建任务:点击左上角的 新建任务

  

  

  

  General

  

  源码管理(这个项目用的是svn,注意要创建的图中的全局凭证,也就是你的svn账户和密码)

  

  构建触发器

  

  我们是手动点击 立即构建 按钮进行构建,你可以设置定时构建和轮询构建

  构建环境

  

  将 Add timestamps to the Console Output 打上勾,会在构建时的控制台中打印出时间

  构建

  

  构建后操作

  点击增加构建后操作步骤

  

  选择 Execute Scripts(需要Jenkins插件支持:Build Step 和  Post build task )

  

  然后点击, Add post build step

  

  点击Add build step,选择执行Shell

  

  出现如下

  

    文本框内需要些一些脚本,会在构建成功之后执行。这里说下我们的解决办法,将前端构建好的文件告诉我们上线管理系统,我们通过自动上线管理系统进行上线

  

#!/bin/bash
NAME="electric-bicycle-web-www"
VERSION=`svnversion` cd /home/szhq/.jenkins/jobs/electric-bicycle-web-www/workspace/dist/
pwd
ls buildme -n $NAME -v $VERSION -d /home/szhq/.jenkins/jobs/electric-bicycle-web-www/workspace/dist/

  构建后操作也可以通过ssh将打完包的文件上传你的服务器(这样子简单粗暴,但是上线没有版本控制,也没有办法进行回滚)

  下面我贴一下构建直接上线的配置:选择Send build artifacts over SSH(需要Jenkins插件: Publish Over SSH)

  

   在SSH Server Name字段选择你的预先配置好的服务器(创建过程: Jenkins -> 系统管理 -> 系统设置 -> Publish over SSH -> SSH Servers,点击新增)

   在Transfers 中:

   Source files 表示上传到服务器的文件的路径,我这里写的当前项目根目录下dist目录下的所有文件,包括static文件夹和index.html,具体的匹配规则请自行查询有关资料

   Remove prefix 表示上传到服务器需要删除的本地路径前缀,这里表示将dist前缀移除,上传到服务器的只有static文件夹和index.html

   Remote directory 表示要删除的服务器上的目录路径,这里是每次上传时将之前的文件全部删除,用新的文件来替换

   Exec command  表示执行的shell脚本,前端暂时需要,感觉这个一般是给部署后台用的,上传jar包后启动服务

    按照上边配置完成后,构建完成后会自动将文件更新到服务器上...

  

 

Jenkins Vue项目自动构建以及构建后续操作的更多相关文章

  1. 如何在输入命令行npm run dev 之后vue项目自动在浏览器打开

    使用代码编辑器打开vue项目代码,在config文件夹里面找到index.js 将里面的:autoOpenBrowser: false, 修改为 :autoOpenBrowser: true, 这个方 ...

  2. vue项目自动构建工具1.0,支持多页面构建

    该工具适用于超多项目开发,每个项目不用都安装依赖,所有依赖都安装在ffk命令项目中,对于多分支拉到本地进行开发,亦有益处.对于多页面开发,也是相当便利,不用手动撸entry和plugin. git: ...

  3. Vue项目自动转换 px 为 rem,高保真还原设计图

    技术栈 vue-cli:使用脚手架工具创建项目. postcss-pxtorem:转换px为rem的插件. 自动设置根节点html的font-size 因为rem单位是相对于根节点的字体大小的,所以通 ...

  4. 【转载】Vue项目自动转换 px 为 rem,高保真还原设计图

    前端开发中还原设计图的重要性毋庸置疑,目前来说应用最多的应该也还是使用rem.然而很多人依然还是处于刀耕火种的时代,要么自己去计算rem值,要么依靠编辑器安装插件转换. 而本文的目标就是通过一系列的配 ...

  5. tox python项目虚拟环境管理自动化测试&&构建工具

    tox 是一个方便的工具,可以帮助我们管理python 的虚拟环境,同时可以进行项目自动测试以及构建 tox 如何工作的 说明 从上图我们也可以看出如何在我们项目中使用tox 参考资料 https:/ ...

  6. cordova+vue 项目打包成Android(apk)应用

    现在使用vue开发的项目越来越多,使用vue开发的移动端打包就成了最大的问题.现在前端打包方案有好多种,但是综合来说,我比较喜欢用cordova来进行Android和ios的打包,配置完成之后,每次只 ...

  7. 在django中部署vue项目,不单独抽离dist文件

    1,在django项目下(app所在目录),新建vue项目,使用脚手架构建vue项目,vue create (项目名) 2,构建好以后,配置django: (1),配置settings: · 修改te ...

  8. vue初级学习--控制台创建vue项目

    一.导语 困困的我,好想睡啊,但还是敲下这边有的没的的笔记吧 二.正文 1.输入 vue list 可查看此环境下,vue能创建的项目模板 没将webpack.vue-route啃精了的话,老实用we ...

  9. vue项目全局引入vue-awesome-swiper插件做出轮播效果

    在安装了vue的前提下,打开命令行窗口,输入vue init webpack swiper-test,创建一个vue项目且名为swiper-test(创建速度可能会有点慢,耐心等),博文讲完后,源码托 ...

随机推荐

  1. 01Design and Analysis Algorithm Using Python-程振波

    1.(p14)比较两个数的大小 a = int(input('num:')) b = int(input('num:')) def getMax(a,b): if a>b : print('Th ...

  2. 51nod 1630(定积分 + 期望)

    51nod1630 每个人进入竞技场后,会等概率随机匹配一个人,匹配到的人与当前胜利和失败场数无关. 胜利达到x场,或失败达到y场后,退出竞技场,根据退出时的胜利场数获得奖励,不能中途放弃. 水平高的 ...

  3. E. Vanya and Balloons Codeforces Round #355 (Div. 2)

    http://codeforces.com/contest/677/problem/E 题意:有n*n矩形,每个格子有一个值(0.1.2.3),你可以在矩形里画一个十字(‘+’形或‘x’形),十字的四 ...

  4. Studio 5000编程:一种累计时间的编程方法

    前言:在很多项目中,需要累计设备的运行.停机.故障时间,当然实现该功能的编程方法也是多种多样,各有千秋,不过有的方法累计误差会越来越大,比如:在连续任务里用定时器来累计时间,就存在一定的误差.本文分享 ...

  5. hibernate之一对多,多对一

    配置文件 <!--一对多--><!--name:集合属性名字 column:外键列名 class:与它相关的对象的完整列名 cascade:级联操作:分3种 save-update: ...

  6. Python3:输出当前目录所有文件的第二种方式-walk()函数

    上一篇,我们讲了用递归的方式输入所有文件路径,其实os还提供了一个好用的方法-walk() 简单看一下: 中文大意就是: 返回的是一个三元tupple(dirpath, dirnames, filen ...

  7. 移动端雪碧图sprite的实现

    移动端适配的时候,通常是用rem作为长宽单位,因此,在不同的设备下,元素的实际宽高(px)是不一样的,如果是单张图片作为为背景图片的时候,最为方便,只要设置背景图片的属性background-size ...

  8. dataguard丢失归档日志处理

    检查alert日志发现报错如下 Wed Mar 27 15:40:30 2019Managed Standby Recovery not using Real Time ApplyParallel M ...

  9. Linux 系统调用sysconf

    1.前言 当前计算机都是多核的,linux2.6提供了进程绑定cpu功能,将进程指定到某个core上执行,方便管理进程.linux提供了sysconf系统调用可以获取系统的cpu个数和可用的cpu个数 ...

  10. 【MySQL】MySQL内连接,左连接,右连接查询

    概念 INNER JOIN(内连接):获取两个表中字段匹配关系的记录.也就是只会返回共有的内容. LEFT JOIN(左连接):获取左表所有记录,即使右表没有对应匹配的记录. RIGHT JOIN(右 ...