聊聊jenkins部署vue/react項目的問題
jenkins安裝請參考文末centOS安裝jenkins。
準備工作
1、安裝參數(shù)化部署插件
Git Parameter Plug-In git參數(shù)化構建，可選擇分支、標簽構建Extended Choice Parameter Plug-In 自定義參數(shù)化構建，可根據(jù)需要任意添加參數(shù)NodeJS Plugin Node環(huán)境，打包vue項目
2、安裝好插件后，配置Nodejs環(huán)境
打開全局工具配置
找到NodeJS，填寫別名，選擇需要安裝的node版本
創(chuàng)建項目
1、創(chuàng)建一個job，選擇構建一個自由風格的軟件項目
2、選擇根據(jù)分支選項構建項目，也可以根據(jù)剛才安裝的Extended Choice Parameter Plug-In插件選擇自定義參數(shù)，已選值建議使用TOP，即第一個
3、添加Git倉庫，校驗填寫Git賬號和密碼，指定分支使用第2步的參數(shù)名，用${}包裹
4、構建環(huán)境添加node
5、添加執(zhí)行shell腳本
shell腳本注解
// 安裝依賴包 npm install // 刪除原有dist目錄 rm -rf ./dist/* // 打包 npm run build // 刪除nginx服務前端資源目錄 rm -rf /usr/share/nginx/html/vue-demo/* // 將打包后的新資源添加到nginx服務前端目錄 cp -rf ./dist/* /usr/share/nginx/html/vue-demo/
上傳到外部服務器
// 通過ssh-keygen命令生成公鑰 ssh-keygen -t rsa // 在/root/.ssh/目錄下會生成一個'id_isa.pub'的文件，將其拷貝到目標主機 // 部署到外部服務器shell腳本 scp -r ./dist/* root@47.100.51.191:/usr/share/nginx/html/vue-demo/
6、構建成功后自動打tag，方便找到對應部署版本。tag內容可根據(jù)需求自己填寫，我使用時間加分支形式，${BUILD_TIMESTAMP}為當前時間，${GIT_BRANCH}為分支
需要安裝全局時間插件，Build Timestamp Plugin，然后，系統(tǒng)管理->系統(tǒng)配置（tag不能有冒號）
構建
1、選擇分支參數(shù)，開始構建
2、開始構建后，可以查看左下構建歷史，查看當前構建信息
3、如有報錯，查看控制臺輸出
補充：下面看下centOS安裝jenkins
centOS安裝jenkins
1、安裝JDK
yum install -y java
2、安裝jenkins
添加Jenkins庫到y(tǒng)um庫，Jenkins將從這里下載安裝。
wget -O /etc/yum.repos.d/jenkins.repo http://pkg.jenkins-ci.org/redhat/jenkins.repo rpm --import https://jenkins-ci.org/redhat/jenkins-ci.org.key yum install -y jenkins
如果不能安裝就到官網(wǎng)下載jenkis的rmp包，官網(wǎng)地址（http://pkg.jenkins-ci.org/redhat-stable/）
wget http://pkg.jenkins-ci.org/redhat-stable/jenkins-2.277.2-1.1.noarch.rpm rpm -ivh jenkins-2.277.2-1.1.noarch.rpm
3、配置jenkis的端口
vi /etc/sysconfig/jenkins
找到修改端口號：
JENKINS_PORT="8080" 此端口不沖突可以不修改
4、啟動jenkins
service jenkins start/stop/restart
到此這篇關于jenkins部署vue/react項目的文章就介紹到這了,更多相關jenkins部署vue/react項目內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
這篇文章主要介紹了React-hooks面試考察知識點匯總,Hook?使你在無需修改組件結構的情況下復用狀態(tài)邏輯，本文結合示例代碼給大家介紹的非常詳細，需要的朋友可以參考下2022-10-10
前兩章講到了，react 在 render 階段的 completeUnitWork 執(zhí)行完畢后，就執(zhí)行 commitRoot 進入到了 commit 階段，本章將講解 commit 階段執(zhí)行過程源碼2022-11-11
這篇文章主要介紹了React與Redux之數(shù)組處理講解,本篇文章通過簡要的案例,講解了該項技術的了解與使用,以下就是詳細內容,需要的朋友可以參考下2021-09-09
這篇文章主要介紹了React中使用UEditor的方法,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-08-08
高階組件就是接受一個組件作為參數(shù)并返回一個新組件（功能增強的組件）的函數(shù)。這里需要注意高階組件是一個函數(shù)，并不是組件，這一點一定要注意，本文給大家分享React 高階組件HOC使用小結，一起看看吧2021-06-06
本篇文章主要介紹了React-Native 橋接iOS原生開發(fā)詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-01-01
大家常常關注的是網(wǎng)站圖片增加水印,而很少關注頁面水印,其實這個需求也是比較常見的,比如公文系統(tǒng)、合同系統(tǒng)等,這篇文章主要給大家介紹了關于react實現(xiàn)頁面水印效果的相關資料,需要的朋友可以參考下2021-09-09
這篇文章主要介紹了react新版本生命周期鉤子函數(shù)及用法詳解,本文通過示例圖文相結合給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2021-04-04
在React中是沒有插槽的概念的, 或者說在React中是不需要插槽的, 因為React對于這種需要插槽的情況非常靈活，本文給大家分享兩種方案實現(xiàn)，分別是children實現(xiàn)插槽和props實現(xiàn)插槽，結合實例代碼給大家介紹的非常詳細，需要的朋友參考下吧2022-09-09
本文主要介紹了深入理解React協(xié)調與調度(Scheduler)原理，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習吧2022-10-10