1. 关联 Git 代码仓库

以开源的若依项目（Vue）为例，先关联好对应的仓库。

在代码目录下分别创建以下目录：

如下图所示。

2. 初始化 .npmrc 文件

将 npm 的私服指向 CODING 制品库。

registry=https://xxx-npm.pkg.coding.net/xxx/npm/
always-auth=true
//xxx-npm.pkg.coding.net/xxx/npm/:username=${CODING_ARTIFACTS_USERNAME}
//xxx-npm.pkg.coding.net/xxx/npm/:_password=${CODING_ARTIFACTS_PASSWORD}
//xxx-npm.pkg.coding.net/xxx/npm/:[email protected]

3. 初始化 nginx.conf 配置

前端依赖 Nginx 的镜像进行部署，所以，我们要把 nginx 的配置也加上。

user  nginx;
worker_processes  1;

error_log  logs/error.log warn;
pid        logs/nginx.pid;

events {
    worker_connections  1024;
}

http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  logs/access.log  main;
    sendfile        on;
    keepalive_timeout  65;
    client_max_body_size   500m;

    server {
        listen       80;
        server_name  localhost;
        charset utf-8;

        gzip_static on;
        gzip_vary on;
        gzip_min_length 1k;
        gzip_comp_level 9;
        gzip_types text/css text/javascript application/javascript application/x-javascript application/xml;
        gzip_disable "MSIE [1-6]\\.";

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   /usr/share/nginx/html;
        }

        location / {
            root   /usr/share/nginx/html;
            index  index.html index.htm;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }

        location ^~ /api/  {
            proxy_pass <http://xxx-admin-server:8070/>;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
    }
}

4. 调整 Dockerfile 打包脚本

FROM nginx:1.15.2-alpine

LABEL maintainer="梦想歌"

COPY dist/ /usr/share/nginx/html

COPY .coding/nginx.conf /etc/nginx/conf.d/default.conf

EXPOSE 80

5. 调整 Jenkinsfile 构建脚本

pipeline {
    agent any
    environment {
        CODING_DOCKER_REPO_NAME = "docker"
        CODING_DOCKER_REPO_HOST = "${CCI_CURRENT_TEAM}-docker.pkg.${CCI_CURRENT_DOMAIN}"
        CODING_DOCKER_REPO_URL = "${CODING_DOCKER_REPO_HOST}/${PROJECT_NAME}/${CODING_DOCKER_REPO_NAME}/${DEPOT_NAME}"

        TCR_NAMESPACE_NAME = "xxx"
        TCR_DOCKER_REPO_URL = "shjrccr.ccs.tencentyun.com/${TCR_NAMESPACE_NAME}/${DEPOT_NAME}"
    }
    stages {
        stage('检出') {
            steps {
                checkout([$class: 'GitSCM',
                branches: [[name: GIT_BUILD_REF]],
                userRemoteConfigs: [[
                url: GIT_REPO_URL,
                credentialsId: CREDENTIALS_ID
                ]]])
            }
        }
        stage('编译') {
            steps {
                script {
                    if (env.TAG_NAME ==~ /.*/ ) {
                        CODING_ARTIFACT_VERSION = "${env.TAG_NAME}"
                    } else if (env.MR_SOURCE_BRANCH ==~ /.*/ ) {
                        CODING_ARTIFACT_VERSION = "mr-${env.MR_RESOURCE_ID}-${env.GIT_COMMIT_SHORT}"
                    } else {
                        CODING_ARTIFACT_VERSION = "${env.BRANCH_NAME.replace('/', '-')}-${env.GIT_COMMIT_SHORT}"
                    }
                }
                sh 'rm -rf /usr/lib/node_modules/npm/'
                dir ('/root/.cache/downloads') {
                    sh 'wget -nc "<https://coding-public-generic.pkg.coding.net/public/downloads/node-linux-x64.tar.xz?version=v16.13.0>" -O node-v16.13.0-linux-x64.tar.xz | true'
                    sh 'tar -xf node-v16.13.0-linux-x64.tar.xz -C /usr --strip-components 1'
                }
                withCredentials([
                    usernamePassword(
                        credentialsId: env.CODING_ARTIFACTS_CREDENTIALS_ID,
                        usernameVariable: 'CODING_ARTIFACTS_USERNAME',
                        passwordVariable: 'CODING_ARTIFACTS_PASSWORD'
                    )]) {
                    script {
                        sh '''
                        echo "CODING_ARTIFACTS_USERNAME=${CODING_ARTIFACTS_USERNAME}" >> $CI_ENV_FILE
                        echo "CODING_ARTIFACTS_PASSWORD=${CODING_ARTIFACTS_PASSWORD}" >> $CI_ENV_FILE
                        '''
                        readProperties(file: env.CI_ENV_FILE).each {
                            key, value -> env[key] = value
                        }
                    }
                    sh 'npm install'
                    sh 'npm run build:prod'
                }
            }
        }
        stage('推送到 Docker 制品库') {
            steps {
                withEnv([
                    "DOCKER_USERNAME=${DOCKER_USERNAME}",
                    "DOCKER_PASSWORD=${DOCKER_PASSWORD}",
                    "DOCKER_IMAGE=${TCR_DOCKER_REPO_URL}:${CODING_ARTIFACT_VERSION}"
                ]) {
                    sh 'docker login --username=${DOCKER_USERNAME} --password=${DOCKER_PASSWORD} shjrccr.ccs.tencentyun.com'
                    sh 'docker build -t ${DOCKER_IMAGE} .'
                    sh 'docker tag ${DOCKER_IMAGE} ${DOCKER_IMAGE}'
                    sh 'docker push ${DOCKER_IMAGE}'
                }
            }
        }
        stage('部署到 K8s 集群') {
            steps {
                withEnv(["DOCKER_IMAGE=${TCR_DOCKER_REPO_URL}:${CODING_ARTIFACT_VERSION}"]) {
                    cdDeploy(deployType: 'PATCH_IMAGE', application: '${CCI_CURRENT_TEAM}', pipelineName: '${PROJECT_NAME}-${CCI_JOB_NAME}-202222222', image: '${DOCKER_IMAGE}', cloudAccountName: 'xxx-k8s-test', namespace: 'test', manifestType: 'Deployment', manifestName: 'xxx-client', containerName: 'xxx-client', credentialId: 'aaaaaaaaaaaaaaaaaaaaaaa', personalAccessToken: '${CD_PERSONAL_ACCESS_TOKEN}')
                }
            }
        }
    }
}