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