欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Jenkins配置前端自動(dòng)打包部署全過(guò)程（若依項(xiàng)目）

 更新時(shí)間：2024年09月02日 09:26:57   作者：諸葛九天  
Jenkins作為一個(gè)開源的自動(dòng)化服務(wù)器,廣泛用于持續(xù)集成、持續(xù)部署(CI/CD)流程中,這篇文章主要給大家介紹了關(guān)于Jenkins配置前端自動(dòng)打包部署（若依項(xiàng)目）的相關(guān)資料,文中通過(guò)圖文介紹的非常詳細(xì),需要的朋友可以參考下

前提說(shuō)明：三臺(tái)服務(wù)器： gitlab 一臺(tái)     jenkins一臺(tái)     項(xiàng)目服務(wù)器   

一、新建項(xiàng)目

創(chuàng)建一個(gè) Freestyle Project

二、拉取 github 代碼

點(diǎn)擊 新建 Item 創(chuàng)建一個(gè) Freestyle Project

在配置頁(yè)面-->General,勾選[丟棄舊的構(gòu)建]，填寫保存的構(gòu)建天數(shù)和構(gòu)建的最大個(gè)數(shù)

在 源碼管理 處選擇 git ，輸入倉(cāng)庫(kù)地址，點(diǎn)擊添加。

三、build 打包

Execute shell里寫腳本,對(duì)前端代碼進(jìn)行打包壓縮具體代碼如下:

# 安裝npm依賴并構(gòu)建項(xiàng)目
npm --registry https://registry.npmmirror.com install
# 構(gòu)建測(cè)試環(huán)境
npm run build:stage

腳本解釋與寫法總結(jié)：

1.我看很多博客 這里寫很多，對(duì)于初學(xué)者 ，可能摸不到頭腦，我該怎么寫，才能自動(dòng)構(gòu)建到測(cè)試環(huán)境。

2.buid steps：構(gòu)建步驟，也就是構(gòu)建環(huán)境配置、打包進(jìn)行處理。

首先前端打包問(wèn)題。

Q：jenkins 從gitlab服務(wù)拉取的代碼在哪里打包吶？

A:拉取的代碼在這目錄下      /var/lib/jenkins/workspace/

在jenkins控制臺(tái)查看

，代碼有了，jenkins打包，但你得安裝nodejs吧  安裝npm  安裝依賴吧，比如你的寫下面這寫

 安裝依賴
npm install

# 建議不要直接使用 cnpm 安裝依賴，會(huì)有各種詭異的 bug?？梢酝ㄟ^(guò)如下操作解決 npm 下載速度慢的問(wèn)題
npm install --registry=https://registry.npmmirror.com

然后打包，構(gòu)建測(cè)試環(huán)境。使用下面命令 

# 構(gòu)建測(cè)試環(huán)境
npm run build:stage

前端打包完，會(huì)生成一個(gè)dist文件夾

好了。這就打包好了。也相當(dāng)于buid 好了。

接下來(lái)，我的把這個(gè)dist文件夾發(fā)送到另一臺(tái)測(cè)試環(huán)境服務(wù)器。

四、部署到測(cè)試服務(wù)器

在真實(shí)的開發(fā)場(chǎng)景中，Jenkins 幾乎不會(huì)和前端資源放到一個(gè)服務(wù)器。大多數(shù)情況下 Jenkins 所處的服務(wù)器環(huán)境就是一個(gè)工具用的服務(wù)器，放置了一些公司中常用的工具。因此構(gòu)建到指定的服務(wù)器也至關(guān)重要。

1、安裝發(fā)送到遠(yuǎn)程插件

系統(tǒng)管理 -> 插件管理 搜索 Publish Over SSH 進(jìn)行安裝。

Send build artifacts over SSH

選項(xiàng)解釋：

  • Source files：要上傳到目標(biāo)服務(wù)器的文件。它是一個(gè)相對(duì)路徑，相對(duì)于 Jenkins 的工作目錄 由于上面的 build 打包后 ，在工作目錄中生成一個(gè)dist文件夾，所以這里寫相對(duì)路徑   **/dist/**
    寫法說(shuō)明
    /dist/*一個(gè)*代表 匹配dist文件夾所以文件，但是dist文件夾下面的static文件夾不會(huì)部署到測(cè)試服務(wù)器（不這樣寫）
    /dist/**2個(gè)* 能把dist文件夾下的所有文件夾和文件都能部署到測(cè)試服務(wù)器（我這樣寫的）
  • Remove prefix：移除的路徑，這里移除 dist 路徑
    比如：這里寫    dist/    表示：我只部署dist文件夾中static 部分內(nèi)容，我肯定要把dist文件夾去掉，只在測(cè)試服務(wù)器顯示static文件，這就用到這個(gè)選項(xiàng)了。
  • Remote directory：發(fā)送到的服務(wù)端路徑（這里填目標(biāo)服務(wù)器發(fā)送文件夾的目標(biāo)路徑）

    1.這里不填：

    表示你在系統(tǒng)設(shè)置中，也有這個(gè)插件，已經(jīng)設(shè)置過(guò)了。

    例如：我在系統(tǒng)設(shè)置中設(shè)置了 /opt/ruoyi       這里就不要設(shè)置了。

    你如果在設(shè)置目標(biāo)路徑，會(huì)重復(fù)，也就是把dist發(fā)送到 /opt/ruoyi/opt/ruoyi/dist  子文件家中了，純屬套娃了。

  • Exec command：發(fā)送成功后執(zhí)行的命令（選填）

部署方式：（我就測(cè)試2種寫法）

1.把整個(gè)前端dist文件夾都部署上傳到測(cè)試服務(wù)器  。我這樣寫 ：就把整個(gè)dist源文件夾發(fā)送到測(cè)試服務(wù)器就行，其他不寫。

2.把部分前端dist文件夾中static文件和其他文件部署上傳到測(cè)試服務(wù)器  。（比較實(shí)用）

如圖：

說(shuō)明：

Source files寫法規(guī)則介紹：Ant User Manual   Directory-based Tasks

為了使事情更加靈活，我們添加了一個(gè)額外的功能，這使得匹配多個(gè)目錄級(jí)別成為可能。這可用于匹配完整的目錄樹，或目錄樹中任何位置的文件。

為此，** 必須將用作目錄的名稱。

當(dāng)**在模式中將用作目錄的名稱時(shí)，它將匹配零個(gè)或多個(gè)目錄。

例如： /test/**匹配 下的所有文件/目錄/test/，例如/test/x.java、 或/test/foo/bar/xyz.html，但不匹配/xyz.xml。

有一種“簡(jiǎn)寫”——如果模式以/ 或結(jié)尾\，則** 附加 。

例如，mypackage/test/被解釋為 mypackage/test/**

五、控制臺(tái)看構(gòu)建是否成功

總結(jié) 

到此這篇關(guān)于Jenkins配置前端自動(dòng)打包部署（若依項(xiàng)目）的文章就介紹到這了,更多相關(guān)Jenkins配置前端自動(dòng)打包部署內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

最新評(píng)論