jenkins打包nodejs

本文详细介绍如何在Jenkins上配置前端项目的自动化打包流程,包括使用NodeJS进行环境准备,通过Pipline实现从代码检出到构建、打包、归档及部署的全过程自动化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

公司前后端分离 ,前端代码需要单独打包

jenkins安装:

https://blog.csdn.net/wanchaopeng/article/details/83538629

nodejs自动打包准备环境:

1.使用自带做简单打包 

1.1.打开jenkins工作桌面,选择新任务

然后填写工程名称,选择"构建一个自由风格的软件项目",

General信息

这里填写项目或任务的基本信息,如下:

源码管理:

然后添加源码,比如本例中使用的是git作为源码版本管理,那么选择源码管理标签,选中git(Jenkins需要安装git插件),填写源码地址,选好分支:

构建环境

构建环境可以理解为要构建的项目需要什么样的环境,这里我们设置环境为node环境:

这里的“NodeJS Installation”是下拉选择的,需要提前在如下地方添加:

系统管理->全局工具配置->NodeJs下面,如下,

注意:如果没有NodeJS项的话,考虑如下插件是否安装:

构建

构建就是指怎么样去操作“源代码”,这里我们填写如下:

然后立即构建,查看控制台输出

2. 使用pipline 打包

添加流水线任务

 
pipeline {
    agent any
    options {
        disableConcurrentBuilds()
        buildDiscarder logRotator(artifactDaysToKeepStr: '', artifactNumToKeepStr: '', daysToKeepStr: '', numToKeepStr: '8')
        timestamps()
        timeout(30)
        
    }
    environment {
        //gitlab key唯一标识符
		git_access_key='gzcfe_gitlab_key'
        //部署应用名称
		deploy_app="shunmai-pay-vue"
        //部署服务器组
		deploy_host="vue_onetree_beta"
        //拉去分支
		deploy_branch="beta"
		//自动部署分支
		Automation_branch="shunmai_vue_beta"
        //定义生成配置
		build_configuration="test"
        //项目目录
		Primary_path="${JOB_NAME.split('/')[0]}"
        //主文件目录
		app_dir="pay.qrcode"
        //ansible文档目录
        Automation_dir="Automation_onetree_config"
        //ansible应用文档目录
        Automation_app_dir="global_template"
    }
    stages {
        stage('checkout') {
            options {
                retry(3)
            }
            steps {
                echo '检查源码'
                sh 'sleep 1'
                checkout([$class: 'GitSCM', \
                        branches: [[name: "*/${deploy_branch}"]], \
                        doGenerateSubmoduleConfigurations: false, \
                        extensions: [[$class: 'RelativeTargetDirectory', \
                                    relativeTargetDir: "${Primary_path}"]], \
                        submoduleCfg: [], \
                        userRemoteConfigs: [[credentialsId: "${git_access_key}", \
                                            url: 'https://git.one.com/dev/shunmai.zhirongyougou.h5client.git']]])
                checkout([$class: 'GitSCM', \
                        branches: [[name: "*/${Automation_branch}"]], \
                        doGenerateSubmoduleConfigurations: false, \
                        extensions: [[$class: 'RelativeTargetDirectory', \
                                    relativeTargetDir: "${Automation_dir}"]], \
                        submoduleCfg: [], \
                        userRemoteConfigs: [[credentialsId: "${git_access_key}", \
                                            url: 'http://git.one.com/yunwei/Automation_onetree_config.git']]\
                        ])
            }
        }
        stage('install') {
            steps {
                echo 'install'
                dir("/${WORKSPACE}/${Primary_path}/${app_dir}"){
                    sh "cnpm install"
                }
            }
        }
        stage('build') {
            steps {
                echo 'build'
                dir("/${WORKSPACE}/${Primary_path}/${app_dir}"){
                    sh "npm run build"
                }
            }
        }
        stage('archive') {
            steps {
                echo '归档'
                dir("/${WORKSPACE}/${Primary_path}/${app_dir}/dist/"){
                    sh 'cp -pr ./qrcode/* ./   &&\
                        tar cf ${deploy_app}.tar * && \
                        mv ${deploy_app}.tar ${WORKSPACE}'
                }
                archiveArtifacts artifacts: '*.tar', \
                                fingerprint: true
            }
        }
        stage('deploy') {
            steps {
                echo '拷贝归档文件'
                copyArtifacts filter: '*.tar', \
                            fingerprintArtifacts: true, \
                            projectName: "${deploy_app}", \
                            selector: specific('${BUILD_NUMBER}'), \
                            target: 'deploy'
                ansiblePlaybook disableHostKeyChecking: true, \
                                extras: '--extra-vars "App_var=${deploy_app} Inventory_var=${deploy_host}"', \
                                installation: 'ansible_2.7', \
                                inventory: "${Automation_dir}/hosts", \
                                playbook: "${Automation_dir}/${Automation_app_dir}/deploy.yml"
            }
        }
    }
    post {
        always {
            cleanWs deleteDirs: true, notFailBuild: true, patterns: [[pattern: "${JOB_NAME.split('/')[0]}", type: 'INCLUDE'],[pattern: "${deploy_app}.tar", type: 'INCLUDE'] , [pattern: 'deploy', type: 'INCLUDE']]
        }
    }
}

构建成功!!!

### 配置Jenkins以支持Node.js应用 #### 安装必要的插件和支持工具 为了使Jenkins能够处理Node.js项目,安装NodeJS插件是必需的操作之一。这允许定义不同版本的Node.js环境,并确保每次构建都能访问到指定版本的Node.js和npm命令[^2]。 ```groovy // Jenkinsfile snippet for installing Node.js plugins pipeline { agent any tools { // Define which version of nodejs you want to use. nodejs 'nodejs' } stages { stage('Install Dependencies') { steps { script { npm install } } } } } ``` #### 设置全局工具配置 进入Jenkins管理界面中的“Global Tool Configuration”,找到并添加新的NodeJS节点来设置默认使用的Node.js版本以及任何所需的全局包。此操作简化了后续管道脚本编写过程中的依赖声明工作[^1]。 #### 创建Pipeline用于自动化流程 通过创建一个多阶段流水线(Multistage Pipeline),可以实现从源码拉取、编译打包直至最终部署的一系列连续动作。下面是一个简单的例子展示如何利用Declarative语法描述一个完整的CI/CD路径: ```groovy pipeline { environment { NODE_VERSION = "14.17.0" } agent any stages { stage('Checkout Code'){ steps{ git branch: 'main', url: 'https://github.com/user/repo.git' } } stage('Setup Environment'){ steps{ withEnv(["PATH+NODE=${tool name: 'NodeJS'}/bin"]) { sh ''' echo $PATH node -v npm -v ''' } } } stage('Build Application'){ steps{ sh 'npm run build' } } stage('Run Tests'){ parallel( unitTests: { sh 'npm test -- --coverage' }, linting: { sh 'npm run lint' } ) } stage('Deploy'){ when { expression { return env.BRANCH_NAME ==~ /^(release|master)$/ } } steps{ sshPublisher(publishers: [ sshPublisherDesc( configName: 'production-server', transfers:[sshTransfer(cleanRemote:true, sourceFiles:'dist/**')], verbose: true)]) } } } } ``` 上述代码片段展示了怎样在一个典型的持续集成环境中执行常见的任务序列——检出仓库最新更改、准备运行时环境、构建前端资源文件夹(`build`)、并发地进行单元测试与静态分析(lint),最后有条件地向生产服务器推送已打包的应用程序副本[^3]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值