我們把一個多人協作的vue前端專案釋出伺服器,一般要經過以下步驟:
- git更新最新的程式碼
- 構建專案
- 把構建後的程式碼上傳到伺服器
如果用jenkins來構建的話,只需要點選一次構建按鈕,就可以自動完成以上的步驟了,而且根據需求,可以實現更多的功能。
1.下載安裝jenkin
1.1 java環境
jenkins需要執行在Java的環境中,所以前提是需要先安裝jdk,測試jdk是否安裝好,在命令列輸入:java -version
1.2 下載jenkins
下載地址 jenkins下載
下載後點選安裝,預設埠是8080,然後開啟 http://localhost:8080/
,會出現如下頁面:
根據提示,輸入管理員密碼,,然後安裝推薦外掛,等待安裝完畢後,然後設定登入的使用者名稱和密碼,就可以進入jenkins的頁面了:
2 配置
2.1 配置遠端伺服器環境
首先下載外掛publish over ssh:
- 進入系統管理,然後點選外掛管理
- 搜尋外掛,並安裝
- 進入系統配置,配置遠端伺服器
- 配置遠端伺服器
- 點選右下角
test configuration
按鈕,測試配置
2.3 配置node環境
- 安裝外掛
nodejs plugin
- 配置新增node版本,點選
global tool configuration
- 新增node版本
3 構建
一些必要的外掛安裝配置過後,就可以開始構建專案了
3.1 新建專案
- 點選新建專案
- 選擇專案模板
3.2 原始碼管理
- 滾動頁面到
原始碼管理
配置項,選擇git
,此配置目的是自動從遠端拉取程式碼,
其中URL就是專案的git的地址,credentials是git登入憑據,還可以指定專案分支,
其中credentials如果是第一次的話,需要點選新增
完成配置後,才能選擇:
3.3 構建環境配置
我們這裡是vue專案,所以選擇node環境,並選擇2.3配置node環境
所配置的node版本:
3.4 構建
這一步jenkins會依次執行我們所配置的指令碼,
- 用指令碼構建專案
選擇execute windows batch command
,這裡面就可以新增指令碼,像在命令列一樣
- 上傳至伺服器
點選增加構建步驟
,然後選擇send files or execute commands over ssh
其中當前專案目錄,如果沒有更改過的話,預設在C:\Windows\System32\config\systemprofile\AppData\Local\Jenkins\.jenkins\workspace\專案名稱
3.5 驗證自動構建
- 開始構建
經過以上的配置,就已經配置好了一個jenkins專案了,返回到首頁,就會有一個專案,點選構建按鈕,就可以自動構建了
- 構建歷史
點選專案名稱,就可以進入到專案詳情頁,然後左下角會有構建歷史,點選構建歷史,就可以檢視每次構建的控制檯輸出情況:
控制檯輸出的資訊:
這樣一個最基本的vue專案的持續構建就完成啦,不需要再手動構建專案,手動上傳到伺服器。