一、总体步骤流程概览

二、脚本路径

三、拉取Git代码

1、配置需要Git打包分支全局变量

 

 2、脚本说明

stage('拉取Git代码') {
    steps {
        echo "\n--------------- 拉取Git代码 start ---------------\n"
        
        // 拉取Git上的最新代码
        git branch: '${compass_web_test_build_branch}', credentialsId: 'bb8bae6b-4812-445b-8e39-caef8db7343b', url: 'https://codeup.aliyun.com/5ff9448b10dfd380901661ec/looksky_compass_repos/looksky-compass-web.git'

        echo "\n--------------- 拉取Git代码 end ---------------\n"
    }
}

四、npm构建打包

1、pipeline脚本

stage('npm打包构建') {
    steps {
      // 调用yarn脚本进行打包编译
      sh "${env.TARGET_HOME_DIR}/jenkins/yarn-build.sh"
    }
}

2、shell脚本 - yarn-build.sh

#!/bin/bash

# 构建目录-Jenkinsfile定义的环境变量 ${TARGET_HOME_DIR}
build_dir=${TARGET_HOME_DIR}

echo "构建目录-Jenkinsfile定义的环境变量 'build_dir' >>> ${build_dir}"

echo -e "\n--------------- npm开始构建打包 start ---------------\n"

# 删除以前构建的dist文件
sh "rm -rf ${build_dir}/dist"
echo "删除以前构建的dist文件目录 >>> ${build_dir}/dist"

# 进入工程打包构建的目录，构建
cd ${build_dir} && yarn build

echo -e "\n--------------- npm开始构建打包 end ---------------\n"

五、上传部署到目标服务器

stage('部署启动工程') {
    steps {
        echo "\n--------------- 部署启动工程 start ---------------\n"

        echo "复制部署目录 [${env.TARGET_WAR_DIR}] to [${env.DEPLOY_DIR}] ... start"

        // 复制最新的dist打包的文件到部署目录
        sh "scp -r ${env.TARGET_WAR_DIR}/* ${env.DEPLOY_REMOTE_SERVER}:${env.DEPLOY_DIR}"

        echo "复制部署目录 [${env.TARGET_WAR_DIR}/**] to [${env.DEPLOY_DIR}] ...ok"

        // 使用root权限 scp过去的文件和目录，通过浏览器域名访问出现403权限问题

        echo "\n修改部署目录权限及用户组 [${env.DEPLOY_DIR}] ... start"

        // 这里使用的是root用户操作，复制过去的文件权限是root用户，需要修改为web归属的用户和用户组
        sh "ssh ${env.DEPLOY_REMOTE_SERVER} chown -R ${env.DEPLOY_DIR_USER}:${env.DEPLOY_DIR_USER} ${env.DEPLOY_DIR}"

        // 修改目录和子目录、文件权限全部未 755
        sh "ssh ${env.DEPLOY_REMOTE_SERVER} chmod -R 755 ${env.DEPLOY_DIR}"

        echo "\n修改部署目录权限及用户组 [${env.DEPLOY_DIR}] ... ok"

        echo "\n--------------- 部署启动工程 end ---------------\n"
    }
}

六、完整Pipeline脚本

pipeline {
    agent any

    environment {
        // 应用名称
        APPLICATION_NAME = "looksky-compass-web"

        // 项目项目名称，为项目工程模块名称，主要用于拼接路径
        PROJECT_NAME = "looksky-compass-web"
        // 项目部署路径
        DEPLOY_DIR = "/usr/local/nginx/html/web/www/${env.APPLICATION_NAME}"
        // 项目部署目录归属的用户和用户组
        DEPLOY_DIR_USER = "compass_web"

        // npm已经打包好的主目录
        TARGET_HOME_DIR = "${env.WORKSPACE}"
        // npm已经打包好的包路径
        TARGET_WAR_DIR = "${env.TARGET_HOME_DIR}/dist"

        // 需要部署的远程机器
        DEPLOY_REMOTE_SERVER = "root@172.18.75.175"
        // 需要部署编译的环境 test: 测试环境 prod: 正式环境
        DEPLOY_BUILD_EVN = "test"
    }

    stages {
        stage('拉取Git代码') {
            steps {
                echo "\n--------------- 拉取Git代码 start ---------------\n"

                // 拉取Git上的最新代码
                git branch: '${compass_web_test_build_branch}', credentialsId: 'bb8bae6b-4812-445b-8e39-caef8db7343b', url: 'https://codeup.aliyun.com/5ff9448b10dfd380901661ec/looksky_compass_repos/looksky-compass-web.git'

                echo "\n--------------- 拉取Git代码 end ---------------\n"
            }
        }

        stage('npm打包构建') {
            steps {
              // 调用yarn脚本进行打包编译
              sh "${env.TARGET_HOME_DIR}/jenkins/yarn-build.sh"
            }
        }

        stage('部署启动工程') {
            steps {
                echo "\n--------------- 部署启动工程 start ---------------\n"

                echo "复制部署目录 [${env.TARGET_WAR_DIR}] to [${env.DEPLOY_DIR}] ... start"

                // 复制最新的dist打包的文件到部署目录
                sh "scp -r ${env.TARGET_WAR_DIR}/* ${env.DEPLOY_REMOTE_SERVER}:${env.DEPLOY_DIR}"

                echo "复制部署目录 [${env.TARGET_WAR_DIR}/**] to [${env.DEPLOY_DIR}] ...ok"

                // 使用root权限 scp过去的文件和目录，通过浏览器域名访问出现403权限问题

                echo "\n修改部署目录权限及用户组 [${env.DEPLOY_DIR}] ... start"

                // 这里使用的是root用户操作，复制过去的文件权限是root用户，需要修改为web归属的用户和用户组
                sh "ssh ${env.DEPLOY_REMOTE_SERVER} chown -R ${env.DEPLOY_DIR_USER}:${env.DEPLOY_DIR_USER} ${env.DEPLOY_DIR}"

                // 修改目录和子目录、文件权限全部未 755
                sh "ssh ${env.DEPLOY_REMOTE_SERVER} chmod -R 755 ${env.DEPLOY_DIR}"

                echo "\n修改部署目录权限及用户组 [${env.DEPLOY_DIR}] ... ok"

                echo "\n--------------- 部署启动工程 end ---------------\n"
            }
        }
    }
}

 七、测试和正式打包Jenkins标签规划

Jenkins标签	说明	备注
开发测试
compass-job-test	looksky-compass-web-job-test : 测试环境打包Job任务
compass-tasks-test	compass-web-task-test : 测试环境web打包任务 (执行这个打包部署到测试环境)
正式环境
compass-job-prod	looksky-compass-web-job-prod : 正式环境打包Job任务
compass-tasks-prod	compass-web-task-prod : 正式环境web打包任务 (执行这个打包部署到正式环境)