使用jenkins的pipeline部署前端vue項目


1、在安裝jenkins服務器上安裝git和nodejs,並且配置環境變量。

安裝完nodejs后,使用npm安裝cnpm。

   npm install -g cnpm --registry=https://registry.npm.taobao.org

cnpm -v驗證安裝是否成功。

2、jenkins安裝git、nodejs、Publish Over SSH 插件

manage jenkins --> manage plugins --> 可選插件
安裝完成后重啟一下jenkins服務http://ip:8080/restart 

3、配置安裝插件相關參數

manage jenkins --> Global Tool Configuration

(1)git默認即可
(2)NodeJS

manage jenkins --> Configuration System
(3)Publish over SSH

4、生產git憑證唯一標識

manage jenkins --> manage credentials

5、pipline模式部署

創建一個視圖,在視圖下新建一個pipeline模式的任務:

編寫pipeline的腳本:

jenkins提供了pipeline語法自動生成工具:

pipeline腳本code:

//git的憑證
def git_auth = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
def url = "https://gitee.com/Kirico/VueDemo_Sell_Eleme.git"
def remote_directory = "/home/xxxx/nginx/html/jenkins-web"

node {
    
    stage('git拉取代碼') {
        checkout([$class: 'GitSCM', 
                  branches: [[name: '*/master']],
                  doGenerateSubmoduleConfigurations: false,
                  extensions: [],
                  submoduleCfg: [],
                  userRemoteConfigs: [[
                                        //credentialsId: "${git_auth}",
                                        url:"${url}"
                                    ]]])
    }
   
    stage('npm打包') {
        //使用NodeJS的npm進行打包
        nodejs('nodejs12'){
            sh '''
                cnpm install
                npm run build
               '''
        }
        
    }
    
    stage('遠程部署') {
        //遠程調用進行項目部署
        sshPublisher(publishers: [sshPublisherDesc(configName: 'nginx_server',
                                                   transfers: [sshTransfer( cleanRemote: false,
                                                                            excludes: '',
                                                                            execCommand: '',
                                                                            execTimeout: 120000,
                                                                            flatten: false,
                                                                            makeEmptyDirs: false,
                                                                            noDefaultExcludes:false, 
                                                                            patternSeparator: '[, ]+',
                                                                            remoteDirectory: "${remote_directory}",
                                                                            remoteDirectorySDF: false,
                                                                            removePrefix: 'dist',
                                                                            sourceFiles: 'dist/**')],
                                                    usePromotionTimestamp: false,
                                                    useWorkspaceInPromotion: false,
                                                    verbose: false)])
    } 
}

保存pipeline腳本,既可以開始構建項目。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM