记事-vue3项目部署Jenkins实现CICD流程

001-前端web服务器安装nginx

安装方式

通过nginx官方yum仓库安装的RPM包

详细信息

版本：nginx 1.26.1

包名：nginx-1.26.1-2.el7.ngx.x86_64

安装日期：2026年5月15日上午6:30:53

来源：NGINX官方仓库 (nginx-packaging@f5.com)

关键文件位置

配置文件：/etc/nginx/nginx.conf

额外配置目录：/etc/nginx/conf.d/

日志目录：/var/log/nginx/

默认站点根目录：/usr/share/nginx/html/

执行文件：/usr/sbin/nginx

系统服务：/usr/lib/systemd/system/nginx.service

安装源配置

nginx是通过nginx官方的CentOS 7仓库安装的，仓库名标识为"el7.ngx"，使用了nginx官方提供的yum源而不是系统的默认仓库

完整的安装过程回顾

安装nginx：

yum install -y nginx
首次启动失败的问题：

根据你的描述，安装后nginx启动失败，这很可能是由于SELinux权限问题导致的。可能的问题包括：
需要的SELinux配置：

你记忆中提到的"配置SELinux的什么id"，实际应该是指以下几种SELinux配置之一：

可能的解决方案A - 文件上下文配置：

复制代码

# 为nginx pid文件配置正确的SELinux上下文
semanage fcontext -a -t httpd_var_run_t "/var/run/nginx\.pid"
restorecon -v /var/run/nginx.pid

在系统中我找到了这个自定义规则：/var/run/nginx.pid system_u:object_r:httpd_var_run_t:s0

可能的解决方案B - SELinux布尔值配置：

复制代码

# 允许nginx进行网络连接（这对于反向代理功能很重要）
setsebool -P httpd_can_network_connect on

当前系统中这个布尔值确实是启用状态。

可能的解决方案C - 端口上下文配置：

复制代码

# 确保nginx监听的端口有正确的SELinux标签
semanage port -a -t http_port_t -p tcp 80
semanage port -a -t http_port_t -p tcp 443

当前系统状态确认

现在nginx在SELinux强制模式下运行正常：

进程域：system_u:system_r:httpd_t:s0

配置文件上下文：system_u:object_r:httpd_config_t:s0

日志文件上下文：unconfined_u:object_r:httpd_log_t:s0

pid文件上下文：system_u:object_r:httpd_var_run_t:s0

网络连接权限：httpd_can_network_connect --> on

所以你记忆中"复杂的SELinux配置"很可能就是需要为nginx配置正确的SELinux上下文和布尔值，这是在启用SELinux的环境中运行nginx的必要步骤

002-在CICD服务器配置Jenkins流水线

新建1个流水线类型的CICD任务
设置参数化构建过程
配置git仓库和凭证

先配置gitlab shh凭证

流水线这里要用凭证和代码仓库

指定代码分支和代码中的Jenkins脚本文件

6.配置发布到的远程服务器信息

003-vue3项目中配置Jenkinsfile脚本文件(根目录下)

文件名称Jenkinsfile

文件内容

复制代码

// GitLab的凭证ID（需在Jenkins凭据管理中提前配置）
def git_auth = "GitLab的凭证ID"
// 钉钉机器人ID（需在Jenkins全局配置中提前添加）
def dingtalk_robot = "钉钉机器人ID"

pipeline {
    agent any
    environment {
        // 定义全局环境变量，便于维护
        //Jenkins所在服务器上自定义安装的node环境位置
        NODE_HOME = '/var/lib/jenkins/tools/jenkins.plugins.nodejs.tools.NodeJSInstallation/nodejs18.19.0'
        //配置阿里npm源地址
        NPM_REGISTRY = 'https://registry.npmmirror.com'  
        //配置构建dist后推送web服务器的dir地址(nginx的资源路径)
        REMOTE_DEPLOY_PATH = '/usr/share/nginx/html'
    }
    
    stages {
        stage('拉取代码') {
            steps {
                checkout([
                    $class: 'GitSCM',
                    branches: [[name: "*/${params.branch ?: '1.0.0'}"]],
                    userRemoteConfigs: [[credentialsId: git_auth, url: 'git@19x.1x8.xx.xxx:cloud/xxx-x-x.git']]
                ])
                // 获取Git Commit信息（适配Git 1.8.3.1版本）
                script {
                    env.GIT_COMMIT_ID = sh(returnStdout: true, script: 'git rev-parse --short HEAD').trim()
                    env.GIT_COMMIT_AUTHOR = sh(returnStdout: true, script: 'git log -1 --pretty=format:"%an"').trim()
                    // 使用Git 1.8.3.1支持的默认日期格式
                    env.GIT_COMMIT_TIME = sh(returnStdout: true, script: 'git log -1 --pretty=format:"%cd"').trim()
                    env.GIT_COMMIT_MESSAGE = sh(returnStdout: true, script: 'git log -1 --pretty=format:"%s"').trim()
                }
            }
        }

        stage('安装依赖') {
            steps {
                // 配置npm镜像源并安装依赖
                sh """
                    export PATH="${NODE_HOME}/bin:${env.PATH}"
                    npm config set registry ${NPM_REGISTRY}
                    npm install --registry=${NPM_REGISTRY}
                """
            }
            post {
                failure {
                    script {
                        // 依赖安装失败发送钉钉通知
                        dingtalk (
                            robot: dingtalk_robot,
                            type: 'MARKDOWN',
                            title: '⚠️ Vue3项目构建失败',
                            text: [
                                "#### 构建失败通知",
                                "- 项目名称：${JOB_NAME}",
                                "- 构建编号：${BUILD_NUMBER}",
                                "- 失败阶段：安装依赖",
                                "- **Git Commit信息**：",
                                "  - Commit ID：${env.GIT_COMMIT_ID}",
                                "  - 作者：${env.GIT_COMMIT_AUTHOR}",
                                "  - 信息：${env.GIT_COMMIT_MESSAGE}",
                                "- 构建地址：[点击查看](${BUILD_URL})"
                            ]
                        )
                    }
                }
            }
        }

        stage('项目构建') {
            steps {
                // 使用NODE_OPTIONS增加内存限制到4GB
                sh """
                    export PATH="${NODE_HOME}/bin:${env.PATH}"
                    NODE_OPTIONS="--max-old-space-size=4096" npm run build:test
                """
            }
            post {
                failure {
                    script {
                        // 构建失败发送钉钉通知
                        dingtalk (
                            robot: dingtalk_robot,
                            type: 'MARKDOWN',
                            title: '⚠️ Vue3项目构建失败',
                            text: [
                                "#### 构建失败通知",
                                "- 项目名称：${JOB_NAME}",
                                "- 构建编号：${BUILD_NUMBER}",
                                "- 失败阶段：项目构建",
                                "- **Git Commit信息**：",
                                "  - Commit ID：${env.GIT_COMMIT_ID}",
                                "  - 作者：${env.GIT_COMMIT_AUTHOR}",
                                "  - 信息：${env.GIT_COMMIT_MESSAGE}",
                                "- 构建地址：[点击查看](${BUILD_URL})"
                            ]
                        )
                    }
                }
            }
        }

        stage('部署到远程服务器') {
            steps {
                sshPublisher(publishers: [sshPublisherDesc(
                    configName: 'master_server_t',
                    transfers: [sshTransfer(
                        cleanRemote: true,  // 清理远程目录旧文件
                        sourceFiles: 'dist/**',
                        removePrefix: 'dist',
                        remoteDirectory: REMOTE_DEPLOY_PATH,
                        execTimeout: 120000
                    )],
                    usePromotionTimestamp: false,
                    useWorkspaceInPromotion: false,
                    verbose: false
                )])
            }
            post {
                success {
                    script {
                        // 部署成功发送钉钉通知
                        dingtalk (
                            robot: dingtalk_robot,
                            type: 'MARKDOWN',
                            title: '🎉 Vue3项目部署成功',
                            text: [
                                "#### 部署成功通知",
                                "- 项目名称：${JOB_NAME}",
                                "- 构建编号：${BUILD_NUMBER}",
                                "- 部署环境：测试环境",
                                "- 部署路径：${REMOTE_DEPLOY_PATH}",
                                "- **Git Commit信息**：",
                                "  - Commit ID：${env.GIT_COMMIT_ID}",
                                "  - 作者：${env.GIT_COMMIT_AUTHOR}",
                                "  - 时间：${env.GIT_COMMIT_TIME}",
                                "  - 信息：${env.GIT_COMMIT_MESSAGE}",
                                "- 构建地址：[点击查看](${BUILD_URL})"
                            ]
                        )
                    }
                }
                failure {
                    script {
                        // 部署失败发送钉钉通知
                        dingtalk (
                            robot: dingtalk_robot,
                            type: 'MARKDOWN',
                            title: '⚠️ Vue3项目部署失败',
                            text: [
                                "#### 部署失败通知",
                                "- 项目名称：${JOB_NAME}",
                                "- 构建编号：${BUILD_NUMBER}",
                                "- 失败阶段：部署到远程服务器",
                                "- **Git Commit信息**：",
                                "  - Commit ID：${env.GIT_COMMIT_ID}",
                                "  - 作者：${env.GIT_COMMIT_AUTHOR}",
                                "  - 信息：${env.GIT_COMMIT_MESSAGE}",
                                "- 构建地址：[点击查看](${BUILD_URL})"
                            ]
                        )
                    }
                }
            }
        }
    }
}

004-使用centos7安装专用node环境-以解决jenkins服务器是centos7时glibc版本太低导致node安装失败

专用nodeJs下载地址（适用于glibc版本太低的Linux）

复制代码

https://unofficial-builds.nodejs.org/download/release/v23.0.0/

centos7环境要使用

node-v23.0.0-linux-x64-glibc-217.tar.gz

005-钉钉群机器人配置

新建机器人时选择自定义机器人，然后要选择自定义关键词CICD，最后会生成webhook地址，这个要配置到Jenkins的钉钉机器人上