當前位置:首頁 » 網頁前端 » jenkinsdocker前端構建
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

jenkinsdocker前端構建

發布時間: 2022-12-09 12:40:24

A. 手把手搭建jenkins + docker + k8s 持續集成、自動化發布環境

持續集成對於微服務開發來說,已經是不可或缺了,能夠極大的提升效率。由於自己在家鼓搗項目的過程中,時常會有一些發布,本著偷懶的目的,在家裡搭建了這套環境,記錄下過程。

todo
流程式控制制

說明下: -u root 、 -v /var/run/docker.sock:/var/run/docker.sock 、 -v /usr/local/bin/docker:/usr/bin/docker 都是為了能夠調用宿主機的docker執行build鏡像

示例的構建用的是一個maven項目

B. docker jenkins 構建 springboot 項目、vue 項目

伺服器IP:以192.168.1.1為例

需要修改下目錄許可權, 因為當映射本地數據卷時,/var/jenkins_mount目錄的擁有者為root用戶,而容器中jenkins user的uid為1000執行如下命令即可

如果需要nginx代理,在nginx中配置

在瀏覽器打開頁面
http://192.168.1.1:9527/jenkins

輸入密碼後,出現這個頁面

選擇安裝推薦的插件

Publish Over SSH 遠程執行ssh插件
Maven Integration plugin maven插件
NodeJs plugin插件

=

C. 怎麼在docker中部署jenkins

使用以下的體系結構組件來部署Jenkins:
Jenkins主伺服器(Java進程)
Jenkins master data (插件,任務定義等)
NGINX web代理(使用SSL證書)
構建slave代理(可以通過SSH、JNLP或Jenkins Master連接)

這是一個很好的開端。通過這一系列博客,我們考慮將上述提到的組件容器化,並使用Docker容器來構建從節點(slaves)。對於初學者,我們將在Docker容器中創建Jenkins主伺服器,然後轉向處理數據持久化,並通過NGINX添加web代理。

整個系列博客將涉及以下幾個Docker概念:

創建你自己的Dockerfiles
最小化對於公共鏡像的依賴
創建和使用數據卷(Data-Volumes),包括備份
利用容器創建容器化的「構建環境」
使用鏡像和Jenkins來處理「機密」數據
如果你還沒有看過Cloudbees的Jenkins Docker鏡像,就從它開始吧,這是一個相當不錯的開端。

D. Jenkins Gitlab 前端構建發布

流程:通常是從gitlab/github拉取項目,構建,把產出文件發到伺服器。

一、環境

創建任務之前,要先配置兩項:

問題1:jenkins credentials配置SSH

系統管理 -> Manage Credentials -> 全局憑據 (unrestricted) ->添加或者編輯

注意:這里的key是個大坑,最開始我糾結是填私鑰還是公鑰,發現粘貼進去都不對。(粘貼私鑰時我粘貼的是正文,沒有復制首尾兩行,導致一直報錯。)最後把私鑰整個粘貼進去就對了。

原因:

由於Jenkins的安全策略配置了CSRF跨站點保護。

解決方案:

進入Jenkins,系統管理-->全局安全配置,勾選匿名用戶具有可讀許可權和去掉CSRF防止跨站點請求偽造:

在 /configure 下

這個插件是jenkins連接linux系統的時候使用。
以下針對插件的每個屬性進行說明。

Name
SSH Server的Name屬性就是你希望連接的伺服器。

Source files
這里輸入的是你希望傳到伺服器的文件夾和文件。路勁是相對jenkins的workspace的項目名稱的。例如編譯打包後的路徑為dist文件夾下的jenkinszip.tar.gz,則Surce files填入dist/jenkinszip.tar.gz。

Remove prefix
如果Source files為dist/jenkinszip.tar.gz,但是不想把dist目錄創建到伺服器端,這個時候就可以在Remove prefix里填入dist

Remote directory
這里指定文件將被拷貝到伺服器的路徑。
PS:被拷貝文件在伺服器上的完整路徑=登錄伺服器賬號的默認路徑(就是全局設置的Remote Directory)+當前任務配置的Remote directory。
例如我的伺服器路徑是 /home/wwwroot/aaa
我全局配置Remote Directory 是 /home/wwwroot
當前任務配置的Remote Directory 是 /aaa/

Exec command
這里就是連接伺服器之後需要執行的命令。

注意:這里配置的Secret token和 webhook要填寫到gitlab裡面,路徑如下:

參考文章: https://blog.csdn.net/hou_ge/article/details/103507947

E. jenkins構建項目的錯誤和原因及其解決方法

我們項目開發完之後需要構建項目發布上線時,通常會使用到jenkins構建工具,然後在使用jenkins工具構建項目時通常也會遇到一些構建錯誤問題,通常情況下,如果項目在自己本地打包時沒有問題,啟動服務時也沒有問題的情況下,可能是jenkins配置問題,需要開發人員配合本地配置項的修改完成,下面我給大家分享一下我遇到的一些構建失敗問題,注意:本篇文章講的主要是關於前端項目的構建失敗問題。

Umi自動化工程創建的react項目

從圖一中可以看出,是構建時打包命令出錯,使用了不能識別的 npm run build:prod ,該命令是前端工程項目中 package.json 包文件中的 scripts 中配置的,該案例中前端並沒有配置build:prod 這個打包命令,如圖:

這里有兩種解決辦法。

直接去jenkins 上將打包命令配置成前端包文件種配置的命令,本案例中因為沒有區分不同的開發環境,而且項目也只有master一個主分支,沒有使用環境變數來區分不同環境的打包命令,所以圖一中的問題,可以直接將jenkins裡面的打包命令配置成圖二中的打包命令 npm run build。去到jenkins 工具中,找到對應的配置項,如圖:

如果項目變得復雜,需要進行嚴格的環境區分,那麼這種情況下建議使用第二種方法,使用環境變數區分不同環境的打包命令,具體步驟如下:

去到前端項目在項目根目錄下找到包文件package.json文件,打開後,在scripts下面配置build:prod 的打包命令,如圖:

去到前端項目中的配置文件config.js中配置 APP_ENV環境變數來區分不同的環境,例如生產環境,開發環境,測試環境等,配置如下:

本文中暫時講到圖一中這種jenkins構建失敗的現象以及導致失敗的原因和針對其不同的兩種解決方法,後續再碰到其它失敗現象再補充,或者大家也可以在評論區回復各自遇到的失敗情況,歡迎留言。

F. jenkins構建docker鏡像

解鎖jenkins

選擇安裝推薦的插件即可,也可以選擇自定義

創建用戶

安裝maven

安裝docker

配置docker

搭建私有倉庫

打開 系統管理》系統配置 頁面 拉到最下面有個cloud選項

接下來新建一個maven項目 點擊 新建任務

添加maven打包完之後的docker鏡像構建命令

dockerfile填寫自己的路徑 默認是pom.xml同級目錄 就是項目的根目錄吧 是否推送倉庫等都是可選的 按需配置

保存後點擊 立即構建