基于Jenkins和gitlab搭建的Vue项目自动构建部署

2,155 阅读2分钟

最近在开发一个前端的项目,由于产品的需求,需要使用Jenkins和公司内网的Gitlab来搭建一个自动构建部署的Vue项目。由于第一次使用Jenkins,在网上找了好多教程都是不是完整的,在摸索了半天之后终于弄好了,下面简单介绍一下:

因为公司服务器已经安装好了gitlab和Jenkins,所以安装这一块就不介绍了。

一.安装配置NodeJS

  1. 安装NodeJS Jenkins -> Manage Jenkins -> Manage Plugins

  2. 如图勾选安装NodeJS插件

  3. 等候安装NodeJS 安装成功

  4. 配置NodeJS Jenkins -> Manage Jenkins -> Manage Plugins

二.安装publish over ssh插件

教程部分涉及到把Jenkins构建好的项目打包发送到服务器部署
Jenkins中插件管理中安装publish over ssh插件 然后在Jenkins中配置SSH信息
Jenkins -> Manage Jenkins -> Configure System 找到 Publish over SSH,填入SSH Key(这部分不会的百度一下SSH Key) 配置ssh服务器信息

二.创建一个Jenkins任务

  1. 点击New Item
  2. 填写任务名称,选择FreeStyle Project
  3. General如图填写配置信息
  4. Source Code Management
    填写git仓库信息,添加git用户信息 填写git仓库的信息
  5. Build Triggers 构建触发器 Jenkins构建触发器有很多种,我这里选了Poll SCM轮询方式
例如:根据开发需要,假设每一个小时我们需要重新构建一次。选择 Build periodically,在 Schedule 中填写 0 * * * *。

第一个参数代表的是分钟 minute,取值 0~59;

第二个参数代表的是小时 hour,取值 0~23;

第三个参数代表的是天 day,取值 1~31;

第四个参数代表的是月 month,取值 1~12;

最后一个参数代表的是星期 week,取值 0~707 都是表示星期天。

所以 0 * * * * 表示的就是每个小时的第 0 分钟执行一次构建。
  1. Build
    点击Add build step,选择Execute shell 输入shell命令
cd /var/lib/jenkins/workspace/Kopak_Test
npm install -g cnpm --registry=https://registry.npm.taobao.org
rm -rf dist
rm -rf kopakcms.tar.gz
cnpm install
cnpm run build
cd dist
tar -zcvf kopakcms.tar.gz *
mv kopakcms.tar.gz
  1. Post Build Actions
    点击Add post-build action, 选择send build artifacts over SSH
cd /var/www/html
rm -rf kopakcms
tar zxvf kopakcms.tar.gz -C /var/www/html
rm -rf kopakcms.tar.gz

全部配置弄好了就可以进行项目的自动化构建了

返回任务的首页,点击Build now

点击Console output可以看到构建信息 最后看到Success就是构建部署成功了

新手第一次发帖,请多多指教,如有错误的地方,大家多交流交流。