teamcity持续集成配置

# 一、已完成持续集成的项目

## 1.XX-运营后台-前端VUE持续集成DEMO已完成

1. teamcity服务器地址：xxx.xxx.xxx.xxx:8111

2. 访客登录账号和密码：guest/guest

3. project目录：

   1. fyhq_testserver_vue_ci指的是项目1的前端VUE持续集成至测试服务器。

   2. fyyy_master:运营平台前端VUE-master分支持续构建至生产.

   3. fyyy_bug:运营平台前端，bug分支持续构建至测试环境

   4. fyyy_dev:运营平台前端，新需求分支持续构建至测试环境。

   5. fysj_master：商家前端VUE-master分支持续构建至生产

   6. fyyy_bug:商家端前端，bug分支持续构建至测试环境

   7. fyyy_dev:商家端前端，新需求分支持续构建至测试环境

 

 

 

 

 

 

   6. 点击【...]可以设置构建时的版本。比如，fyyy_version,设置版本为master，则填写master,构建时，将去git上下拉master的分支。

 

 

 

 

    git上显示的分支名称（需要和开发确认，【重要】)

 

 

 

   确认构建分支后，点击[run build]或则【run】

 

 

 

 

   项目列表会显示进行中

 

 

 

   查看构建细节，点击向下箭头：

 

 

 

   若构建失败，可以查看构建日志（build log)

 

 

 

   7. 构建完毕后，测试服务器将为最新版本的代码，并且保存上个版本的程序，并已分支进行保存。

   测试服路径/usr/local/nginx/html/ci_dir/test/backup1下

将保存上个版本的文件，便于手动回滚（目前未作自动回滚机制）

 

 

 

   测试服路劲/usr/local/nginx/html/ci_dir/test/backup2下保存所有版本的zip文件。

 

 

 

##2.构建前端集成须知

   1. 前端告之运维工程师，构建流程+依赖包

   1. 必须要告知构建版本—【重要】

 

## 3.已完成

   1. 目前项目1的2个前端VUE所有分支持续构建已经完成。

## 4.待完成

   1. 构建成功后的邮件提醒功能。

   2. 小程序端持续构建。

   

   

# 二、teamcity项目配置说明

## 2.1登录teamcity服务器

xxx.xxx.xxx.xxx:8111

账号密码 @管理员 创建

 

 

 

 

## 2.2 创建项目

Administration-->create project

 

 

 

 

## 2.3 创建主项目名称

填写必要信息后,创建，如项目2的VUE持续集成

parent project: root project

name:txcns_vue_ci

 

 

 

 

 

## 2.4 创建不同的build配置

如：项目2的商家端DEV分支版本的build

    项目2的运营端dev分支版本的build

点击【create build configuration】

 

 

 

 

 

 

创建商家端DEV分支版本的build,注意是manually方式:

 

 

 

 

 

 

由于项目名称和分支版本很多，后期维护不方便，使用全局变量来控制。

 

在项目下建立全局变量：

路径：projects-->-->build版本-->parameters

配置变量：client_name  和 version

先配置商家后台:

client_name = ecsj

branch = dev

server_ip = xxx.xxx.xxx.xxx

testserver_deploy_dir = /usr/local/nginx/html/elephant/

testserver_ci_dir = /usr/local/nginx/html/ci_dir/

不同项目目标服务器IP不同

 

 

 

### 2.4.0 teamcity需要手动生成build目录

build目录为配置的版本在服务器上运行的目录

 

执行路径：projects-->build名称-->run

 

 

 

 

 

 

执行完后，查看build log 日志。

 

 

 

 

 

记录该目录地址： /data/TeamCity/buildAgent/work/d25ae26073a95258

后续部署中需要用到。

 

 

 

 

 

### 2.4.1 配置目标服务器的密钥

 

由于持续部署需要访问目标服务器，通过配置密钥，可以很方便的访问服务器。

密钥由服务器管理员提供。下图显示密钥：

 

 

 

 

 

配置路径：projects-->目标项目-->project setting-->SSH KEYS-->添加密钥

 

 

 

 

 

### 2.4.2 配置版本

1.选择GIT的方式，并填写GIT地址，去GITEA上获取代码地址，如：http://xxx.xxx.xxx.net/Web/automobile-system.git

 

 

 

 

 

2.在teamcity配置版本相关信息

Type of VCS 设置为 GIT

VCS root name 配置为GIT上的地址 + #refs/heads/%branch% ,branch为之前步骤设置的变量

 

http://git.xxxx.net/Web/automobile-system.git#refs/heads/%branch%

VCS root Id 自动生成

fetch URL 设置为：http://xxx.xxx.xxx.net/Web/automobile-system.git

default branch：refs/heads/%branch%

Authentication method:设置为password(如果有git服务器的private key，可使用)

username:使用git的账号和密码

password:

 

以上配置如下图所示：

 

 

 

 

 

测试账号密码是否能够连接git仓库，sucess即成功！

 

 

 

 

 

 

 

测试没有问题，则create创建。

 

 

### 2.4.3 创建vue代码构建步骤

前提：服务器上已经安装了node,版本是8.2.0

注明：每一步的命令需要和前端工程师确认，不同项目命令存在差异.如，有的工程师会将构建步骤在git描述。

 

 

 

 

 

1.配置第一步 npm install,此步骤是添加vue项目的依赖包,如下图配置：

 

runner type : Commond line

step name: npm install

execute step: if all pervious steps finished successfully

run: custom script

custom script: npm install --registry=https://registry.npm.taobao.org

 

 

 

 

 

点击save保存

 

2.配置第二步，npm run build,此步骤为构建vue（打包前端），如下图配置:

runner type : Commond line

step name: npm run build

execute step: if all pervious steps finished successfully

run: custom script

custom script: npm run build

 

 

 

 

 

点击save保存。

 

3.配置第三步,将vue的包推送到目的服务器（测试服务器）。

目标服务器需要建立版本备份目录：

 上个版本的历史备份路径：/usr/local/nginx/html/ci_dir/test/backup1

 新版本的历史备份路径:/usr/local/nginx/html/ci_dir/test/backup2

 新包存放及压缩路径：/usr/local/nginx/html/ci_dir/test/new

 deploy脚本：/usr/local/nginx/html/ci_dir/deploy/

目标服务器地址：xxx.xxx.33.53,此处也可以参数化到parameter中%server_ip%。

 

 

配置如下：

 

Runner type: SSH Upload

step name: upload vue package to testserver

execute step: if all pervious steps finished successfully

target: %server_ip%:/usr/local/nginx/html/ci_dir/test/new/%client_name% _ %branch%

transport protocol: SCP

Authentication method: Uploaded key

username: root

select key: id-ras-txcns

paths to sources:

/data/TeamCity/buildAgent/work/d25ae26073a95258/dist=>dist.zip

 

备注：以上路径使用步骤2.4.0中的目录地址

 

配置图：

 

 

 

 

 

 

4.配置第四步，在测试服务器替换前端包，并做备份。

 

配置如下：

 

Runner type: SSH exec

step name: deploy and backup

execute step: if all pervious steps finished successfully

target: %server_ip%

Authentication method: Uploaded key

username: root

select key: id-ras-txcns

commands： /usr/bin/sh -x /usr/local/nginx/html/ci_dir/deploy/deploy_test.sh %branch% %client_name% %testserver_deploy_dir%

 

备注：deploy_test.sh

该文件为发布和备份脚本，脚本如下：

 

#!/bin/bash

time=$(date '+%Y%m%d_%k%M'|sed s/[[:space:]]//g)

version=$1

app=$2

testserver_deploy_dir=$3

testserver_ci_dir=$4

 

if [ ! -d ${testserver_deploy_dir}${app} ]; then

mdkir ${testserver_deploy_dir}${app}

else

if [ ! -f ${testserver_deploy_dir}"${app}/version.txt" ]; then

mv ${testserver_deploy_dir}${app} ${testserver_ci_dir}"test/backup1/"${app}"_"${time}

else

bv=$(cat ${testserver_deploy_dir}${app}"/version.txt")&&mv ${testserver_deploy_dir}${app} ${testserver_ci_dir}"test/backup1/"${app}"_"${bv}"_"${time}

fi

fi

 

cd ${testserver_ci_dir}"test/new/"${app}"_"${version}

unzip -o dist.zip&&rm -rf dist.zip

cd ..

zip -r ${app}"_"${version}"_"${time}".zip" ${app}"_"${version}&&mv ${app}"_"${version}  ${testserver_deploy_dir}${app}&&mv ${app}"_"${version}_${time}.zip ../backup2/ &&cd ${testserver_deploy_dir}${app}"/" &&echo "${version}" > version.txt

 

6.测试部署是否成功。

路径：projects-->分支build名称-->run-->查看build log

 

 

 

 

 

查看build log详情

 

 

 

 

 

sucess表示运行成功,运行时间也可以查看

 

 

 

 

构建失败时，需要查看日志，并找相关项目前端开发人员排查问题。

 

 

 

 

 

 

 

 

 

 

备注：上图的报错是因为在windows环境下打包VUE，忽略大小写敏感，而在linux下打包VUE，必须严格按照大小写来命名组件名称。因此将大小写设置统一，即可解决问题。

 

### 2.4.4 触发器设置

 

触发器是为了简化人工run操作，达到开发人员提交分支代码后，teamcity自动运行。

 

添加触发器：

路径：projects-->project-->build name-->triggers-->add new trigger-->select VCS trigger

如图配置：

 

 

 

 

 

OK.这样一个前端VUE自动化部署配置就完成。