1.Jenkins部署前端項目
在使用Jenkins部署前端項目時需要搭建好 JenKins 的自動化部署環境。
1）Linux服務器上安裝好了JDK 或者 OpenJDK 軟件，並配好了環境變量
2）Linux服務器上安裝好 Jenkins 軟件，並安裝了 JenKins 推薦安裝的插件
3）Linux服務器上安裝好了Node軟件，並配好了環境變量（npm 需要設置淘寶鏡像）
# 設置淘寶鏡像
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
- 1
- 2
- 3
1.新建任務
1）首先 登錄自己搭建好的 JenKins 后台系統。
2）然后在首頁的菜單欄中點擊新建任務。
3）輸入新建任務的名稱（填寫項目的名稱即可，下面項目的名稱用 testweb）
4）選擇 構建一個自由風格的軟件項目 然后點擊確認，即可完成一個構建任務的新建。
新建任務 是什么任務？上面新建的 testweb 任務就是一個 集成了自動化構建與部署 testweb項目的任務。
2.General
上面點擊確認之后會進入到下面這個頁面，這個頁面的作用就是對 testweb任務的基本配置。
1 ) 填寫任務的基本描述（可選）
2 ）勾選丟棄舊的構建（可選）
a）保持構建的天數（可選），構建記錄將保存10天數
b）保持構建的最大個數（可選），最多8個數目的構建記錄將被保存
c）發布包保留天數（可選），點擊右邊的高級可填寫
d）發布包最大保留#個構建（可選），點擊右邊的高級可填寫
3）填完后點擊底部的 應用
參數構建過程（當點擊 立即構建 時可以手動選擇構建的分支和Tag，需要安裝Git Parameter插件）
3.源碼管理
指定 testweb任務 需要管理的源碼和倉庫，后面JenKins在自動化構建的時候會自動把這里配置的源碼 clone下來進行自動化構建。
1）指定源碼的git倉庫 https://github.com/LiuJunb/testweb.git（ 這里使用github中的倉庫 ）
testweb項目目錄結構：
|-- package.json
|-- README.md
|-- src
| | `-- common.js | | `-- index.html
| | `-- main.css | `-- main.js
`-- webpack.config.js
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
2）點擊添加，是添加 github 倉庫操作的用戶名和密碼
3）第二步添加完github 倉庫操作的用戶名和密碼后，第三步選擇使用的對應的用戶名和密碼
4）指定以后clone的分支（下面指定的是主分支）
第一步指定源碼的git倉庫路徑時報錯？
1）Linux服務器上沒安裝好了Git軟件或者環境變量沒配好
2）沒有完成下面第2步和第3步（也就是說沒用添加用戶名和密碼，或者用戶名和密碼不對）
2）點擊添加，是添加 github 倉庫操作的用戶名和密碼示例圖
填寫完 用戶名和密碼 后點擊添加 即可
4.構建觸發器
給 testweb 任務添加構建觸發器（即什么時候開始觸發自動化構建）。
1 ) 勾選輪詢SCM （ Software configuration management 軟件配置管理 ），作用就是定時檢查git倉庫中的代碼是否有更新，如果有更新就行觸發一次構建。
2 ）填寫輪詢的規則H/15 * * * *（每隔15分鍾觸發一次構建，填寫規則可以點擊第3步的問號可以查看語法）
日程表填寫的語法：
# 每隔15分鍾觸發一次構建(即每15分鍾會自動觸發一次檢查git倉庫中代碼是否發生變化，如果變就觸發一次構建)
H/15 * * * *
# every ten minutes in the first half of every hour (three times, perhaps at :04, :14, :24)。每小時的前29分鍾，每隔10分鍾觸發一次構建
H(0-29)/10 * * * *
# once every two hours at 45 minutes past the hour starting at 9:45 AM and finishing at 3:45 PM every weekday.
45 9-16/2 * * 1-5
# once in every two hours slot between 9 AM and 5 PM every weekday (perhaps at 10:38 AM, 12:38 PM, 2:38 PM, 4:38 PM)
H H(9-16)/2 * * 1-5
# once a day on the 1st and 15th of every month except December
H H 1,15 1-11 *
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
5.構建環境
選擇 testweb 的構建環境（因為前端的模塊化構建項目需要依賴Node環境）。
1）選擇 Provide Node & npm bin/ folder to PATH
沒出現這個選項？請安裝 NodeJS 插件
2）選擇已經配好的Node環境別名Node10.16（ NodeJS Installation ）
沒得選？1）請安裝 NodeJS 插件 2）在系統管理->全局工具配置-> 找到NodeJS, 並新建一個NodeJS環境
不會安裝 NodeJS 插件 和 配置新建一個NodeJS環境的可往下面看
1.安裝 NodeJS 插件
1 ) 在線安裝
在系統管理->插件管理-> 可選插件 ->右邊搜索NodeJS -> 然后點擊直接安裝->安裝完成后重啟JenKins
2 ）或離線安裝
在系統管理->插件管理-> 高級 -> 在上傳插件中選擇離線插件（插件格式xxx.hpi） -> 然后點擊上傳->安裝完成后重啟JenKins
2.配NodeJS環境
在系統管理->全局工具配置-> 找到NodeJS
1 ) 找到NodeJS, 然后點擊 新增NodeJS（有自動安裝 NodeJS 環境，也可以直接使用系統安裝好的NodeJS，下面使用系統安裝好的NodeJS，點擊 新增NodeJS之后 點擊取消自動安裝 NodeJS）
2 ) 輸入NodeJS的別名Node10.16 和 選擇系統已經安裝好的Node的安裝目錄（注意不用到Node的bin目錄）
3 ）配置完成后點擊保存，然后回到上面的第二步就可以選擇剛才起的別名Node10.16
6.構建
編寫構建 testweb 項目的命令：npm install npm run build
1 ）點擊添加構建步驟 > 選擇執行shell
2 ) 編寫構建testweb項目的命令
3 ）最后點擊保存
執行構建的 命令
pwd
ls
node -v
npm -v
git --version
java -version
echo '構建的版本號:'${BUILD_NUMBER}
npm install
npm run build
pwd
echo '----- 以上的列出的文件是 jenkin 服務 workspace 中 testweb 目錄下的文件-------'
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
其中 ${BUILD_NUMBER} 是引用了環境變量列表中的 BUILD_NUMBER 變量
7.測試一下立即構建
上面編寫完構建命令之后，點擊保存后來到這個頁面。
1）點擊下面的立即構建-測試一個下構建是否成功
2）點擊第2步可以查看構建詳情
1.查看構建控制台輸出
Started by user liujun
Running as SYSTEM
Building in workspace /var/lib/jenkins/workspace/testweb
using credential 54155335-c222-4785-81f2-9bc4f89f72aa
> git rev-parse --is-inside-work-tree # timeout=10
Fetching changes from the remote Git repository
> git config remote.origin.url https://github.com/LiuJunb/testweb.git # timeout=10
Fetching upstream changes from https://github.com/LiuJunb/testweb.git
> git --version # timeout=10
using GIT_ASKPASS to set credentials
> git fetch --tags --progress https://github.com/LiuJunb/testweb.git +refs/heads/*:refs/remotes/origin/* > git rev-parse refs/remotes/origin/master^{commit} # timeout=10 > git rev-parse refs/remotes/origin/origin/master^{commit} # timeout=10 Checking out Revision 68edba65647b77c1cf78df941d5f73875a529da2 (refs/remotes/origin/master) > git config core.sparsecheckout # timeout=10 > git checkout -f 68edba65647b77c1cf78df941d5f73875a529da2 Commit message: "msg" > git rev-list --no-walk 7d7722b7c926d7f8688326ce40d3d1b51961e851 # timeout=10 [testweb] $ /bin/sh -xe /tmp/jenkins2081174913781868196.sh + pwd /var/lib/jenkins/workspace/testweb + ls package.json package-lock.json README.md src webpack.config.js + node -v v10.16.3 + npm -v 6.9.0 + git --version git version 1.8.3.1 + java -version java version "1.8.0_151" Java(TM) SE Runtime Environment (build 1.8.0_151-b12) Java HotSpot(TM) 64-Bit Server VM (build 25.151-b12, mixed mode) + echo 構建的版本號:3 構建的版本號:3 + npm install npm WARN testcssloader@1.0.0 No repository field. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"}) added 400 packages from 225 contributors in 22.49s + npm run build > testcssloader@1.0.0 build /var/lib/jenkins/workspace/testweb > webpack --mode production Hash: 8b18626cfb5996c8c259 Version: webpack 4.41.2 Time: 1150ms Built at: 10/21/2019 12:34:15 PM Asset Size Chunks Chunk Names bundle.js 6.93 KiB 0 [emitted] main Entrypoint main = bundle.js [0] ./src/main.js 249 bytes {0} [built] [1] ./src/common.js 148 bytes {0} [built] [2] ./src/main.css 1.05 KiB {0} [built] [3] ./node_modules/css-loader/dist/cjs.js!./src/main.css 174 bytes {0} [built] + 3 hidden modules + pwd /var/lib/jenkins/workspace/testweb + echo '----- 以上的列出的文件是 jenkin 服務 workspace 中 testweb 目錄下的文件-------' ----- 以上的列出的文件是 jenkin 服務 workspace 中 testweb 目錄下的文件------- Finished: SUCCESS - 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
2.查看構建的結果
查看 JenKins 安裝目錄下 workspace 目錄下的 testweb 項目
/var/lib/jenkins/workspace/testweb
- 1
1 ）構建時執行 npm install 后會生成 node_modules文件夾
2 ) 構建時執行 npm run build 后會生成 dist目標文件
生成 dist 目標文件后，如何部署項目？
8.構建后的操作
上面配置完構建的命令后，點擊立即構建，其實已經成功實現了自動化構建。但是項目只是完成了構建，還沒有完成項目的部署來。那么打包后生成的dist文件如何部署起來呢？這個時候需要配置一下 構建后操作 了。
1.安裝Publish over SSH插件
1）在線安裝
在系統管理->插件管理-> 可選插件 ->右邊搜索Publish over SSH-> 然后點擊直接安裝 ->安裝完成后重啟JenKins
2）或離線安裝
在系統管理->插件管理-> 高級 -> 在上傳插件中選擇離線插件（插件格式xxx.hpi） -> 然后點擊上傳 ->安裝完成后重啟JenKins
2.配置Publish over SSH
系統管理->系統設置->Publish over SSH->SSH Servers
-
指定遠程
web測試服務器的登錄密碼xxxxx -
指定遠程
web測試服務器的名稱 -
指定遠程
web測試服務器的 ip :xxx.xxx.xxx.xxx -
指定遠程
web測試服務器登錄的用戶名root -
指定遠程
web測試服務器部署的目錄(不是部署項目的名稱)/usr/local/webserver/nginx -
測試 JenKins 鏈接 遠程
web測試服務器是否成功
這里的 web測試服務器 和 JenKins所在的服務器是不同的兩個服務器。其中 JenKins所在的服務器是用來部署JenKins的，web測試服務器是用來部署前端項目的
3.添加構建后的操作
進入到 testweb任務 的配置頁面, 拉倒最底部
1）點擊 增加構建后操作步驟
2）選擇 Send build artifacts over SSH
沒有這個選項？檢查是否安裝了 Publish over SSH 插件
4.用Publish over SSH插件實現項目遠程部署
1） 第1步選擇遠程部署的服務器web測試服務器
（這個服務器是在：系統管理->系統設置->Publish over SSH->SSH Servers->name 指定的服務器的名稱。如果沒有指定是沒有下拉選項的）
2）第2步指定構建后/var/lib/jenkins/workspace/testweb/dist 目錄下所有的文件(包含dist目錄)上傳到遠程的web測試服務器。
3） 第3步指定忽略不上傳文件夾的前綴, 下面指定 dist 這個目錄不用上傳，只上傳dist目錄下所有的文件
4）第4步指定上傳到遠程web測試服務器的testweb目錄 。這個目錄沒有會自定新建。
testweb目錄是相對與：系統管理->系統設置->Publish over SSH->SSH Servers->Remote Directory指定的遠程服務器的路勁下創建的目錄。絕對路勁是：
/usr/local/webserver/nginx/testweb/
5） 第5步 指定發布后的操作，備份項目，並打印出回滾的命令。
6）配置完成，可以點擊立即構建測試
# 進入項目的文件夾 （ 項目路徑: /usr/local/webserver/nginx/testweb/testweb/xxxx ）
echo '--- 1.進入項目的文件夾：---'
cd /usr/local/webserver/nginx/testweb/testweb
pwd
# 打包壓縮項目文件
echo '--- 2.打包壓縮項目的文件：---'
# 自動創建testweb-copy文件夾，存在則創建失敗。mkdir -p a/b/c 創建多級目錄
mkdir /usr/local/webserver/nginx/testweb-copy
tar -zcvf /usr/local/webserver/nginx/testweb-copy/${JOB_NAME}-${BUILD_ID}.tar.gz *
# 查看壓縮備份后的文件
cd /usr/local/webserver/nginx/testweb-copy
echo '--- 3.下面是已經備份項目的版本：---'
ls
# 回復備份
echo '--- 4.下面是備份回滾的命令：---'
echo '刪除舊項目：rm -rf /usr/local/webserver/nginx/testweb/*'
echo '回滾指定版本: tar -zxvf /usr/local/webserver/nginx/testweb-copy/testweb-16.tar.gz -C /usr/local/webserver/nginx/testweb/'
echo '停止服務：/usr/local/webserver/nginx/sbin/nginx -s stop'
echo '重啟服務：/usr/local/webserver/nginx/sbin/nginx'
echo '--- 構建結束 ---'1.Jenkins部署前端項目
在使用Jenkins部署前端項目時需要搭建好 JenKins 的自動化部署環境。
1）Linux服務器上安裝好了JDK 或者 OpenJDK 軟件，並配好了環境變量
2）Linux服務器上安裝好 Jenkins 軟件，並安裝了 JenKins 推薦安裝的插件
3）Linux服務器上安裝好了Node軟件，並配好了環境變量（npm 需要設置淘寶鏡像）
# 設置淘寶鏡像
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
- 1
- 2
- 3
1.新建任務
1）首先 登錄自己搭建好的 JenKins 后台系統。
2）然后在首頁的菜單欄中點擊新建任務。
3）輸入新建任務的名稱（填寫項目的名稱即可，下面項目的名稱用 testweb）
4）選擇 構建一個自由風格的軟件項目 然后點擊確認，即可完成一個構建任務的新建。
新建任務 是什么任務？上面新建的 testweb 任務就是一個 集成了自動化構建與部署 testweb項目的任務。
2.General
上面點擊確認之后會進入到下面這個頁面，這個頁面的作用就是對 testweb任務的基本配置。
1 ) 填寫任務的基本描述（可選）
2 ）勾選丟棄舊的構建（可選）
a）保持構建的天數（可選），構建記錄將保存10天數
b）保持構建的最大個數（可選），最多8個數目的構建記錄將被保存
c）發布包保留天數（可選），點擊右邊的高級可填寫
d）發布包最大保留#個構建（可選），點擊右邊的高級可填寫
3）填完后點擊底部的 應用
參數構建過程（當點擊 立即構建 時可以手動選擇構建的分支和Tag，需要安裝Git Parameter插件）
3.源碼管理
指定 testweb任務 需要管理的源碼和倉庫，后面JenKins在自動化構建的時候會自動把這里配置的源碼 clone下來進行自動化構建。
1）指定源碼的git倉庫 https://github.com/LiuJunb/testweb.git（ 這里使用github中的倉庫 ）
testweb項目目錄結構：
|-- package.json
|-- README.md
|-- src
| | `-- common.js | | `-- index.html
| | `-- main.css | `-- main.js
`-- webpack.config.js
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
2）點擊添加，是添加 github 倉庫操作的用戶名和密碼
3）第二步添加完github 倉庫操作的用戶名和密碼后，第三步選擇使用的對應的用戶名和密碼
4）指定以后clone的分支（下面指定的是主分支）
第一步指定源碼的git倉庫路徑時報錯？
1）Linux服務器上沒安裝好了Git軟件或者環境變量沒配好
2）沒有完成下面第2步和第3步（也就是說沒用添加用戶名和密碼，或者用戶名和密碼不對）
2）點擊添加，是添加 github 倉庫操作的用戶名和密碼示例圖
填寫完 用戶名和密碼 后點擊添加 即可
4.構建觸發器
給 testweb 任務添加構建觸發器（即什么時候開始觸發自動化構建）。
1 ) 勾選輪詢SCM （ Software configuration management 軟件配置管理 ），作用就是定時檢查git倉庫中的代碼是否有更新，如果有更新就行觸發一次構建。
2 ）填寫輪詢的規則H/15 * * * *（每隔15分鍾觸發一次構建，填寫規則可以點擊第3步的問號可以查看語法）
日程表填寫的語法：
# 每隔15分鍾觸發一次構建(即每15分鍾會自動觸發一次檢查git倉庫中代碼是否發生變化，如果變就觸發一次構建)
H/15 * * * *
# every ten minutes in the first half of every hour (three times, perhaps at :04, :14, :24)。每小時的前29分鍾，每隔10分鍾觸發一次構建
H(0-29)/10 * * * *
# once every two hours at 45 minutes past the hour starting at 9:45 AM and finishing at 3:45 PM every weekday.
45 9-16/2 * * 1-5
# once in every two hours slot between 9 AM and 5 PM every weekday (perhaps at 10:38 AM, 12:38 PM, 2:38 PM, 4:38 PM)
H H(9-16)/2 * * 1-5
# once a day on the 1st and 15th of every month except December
H H 1,15 1-11 *
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
5.構建環境
選擇 testweb 的構建環境（因為前端的模塊化構建項目需要依賴Node環境）。
1）選擇 Provide Node & npm bin/ folder to PATH
沒出現這個選項？請安裝 NodeJS 插件
2）選擇已經配好的Node環境別名Node10.16（ NodeJS Installation ）
沒得選？1）請安裝 NodeJS 插件 2）在系統管理->全局工具配置-> 找到NodeJS, 並新建一個NodeJS環境
不會安裝 NodeJS 插件 和 配置新建一個NodeJS環境的可往下面看
1.安裝 NodeJS 插件
1 ) 在線安裝
在系統管理->插件管理-> 可選插件 ->右邊搜索NodeJS -> 然后點擊直接安裝->安裝完成后重啟JenKins
2 ）或離線安裝
在系統管理->插件管理-> 高級 -> 在上傳插件中選擇離線插件（插件格式xxx.hpi） -> 然后點擊上傳->安裝完成后重啟JenKins
2.配NodeJS環境
在系統管理->全局工具配置-> 找到NodeJS
1 ) 找到NodeJS, 然后點擊 新增NodeJS（有自動安裝 NodeJS 環境，也可以直接使用系統安裝好的NodeJS，下面使用系統安裝好的NodeJS，點擊 新增NodeJS之后 點擊取消自動安裝 NodeJS）
2 ) 輸入NodeJS的別名Node10.16 和 選擇系統已經安裝好的Node的安裝目錄（注意不用到Node的bin目錄）
3 ）配置完成后點擊保存，然后回到上面的第二步就可以選擇剛才起的別名Node10.16
6.構建
編寫構建 testweb 項目的命令：npm install npm run build
1 ）點擊添加構建步驟 > 選擇執行shell
2 ) 編寫構建testweb項目的命令
3 ）最后點擊保存
執行構建的 命令
pwd
ls
node -v
npm -v
git --version
java -version
echo '構建的版本號:'${BUILD_NUMBER}
npm install
npm run build
pwd
echo '----- 以上的列出的文件是 jenkin 服務 workspace 中 testweb 目錄下的文件-------'
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
其中 ${BUILD_NUMBER} 是引用了環境變量列表中的 BUILD_NUMBER 變量
7.測試一下立即構建
上面編寫完構建命令之后，點擊保存后來到這個頁面。
1）點擊下面的立即構建-測試一個下構建是否成功
2）點擊第2步可以查看構建詳情
1.查看構建控制台輸出
Started by user liujun
Running as SYSTEM
Building in workspace /var/lib/jenkins/workspace/testweb
using credential 54155335-c222-4785-81f2-9bc4f89f72aa
> git rev-parse --is-inside-work-tree # timeout=10
Fetching changes from the remote Git repository
> git config remote.origin.url https://github.com/LiuJunb/testweb.git # timeout=10
Fetching upstream changes from https://github.com/LiuJunb/testweb.git
> git --version # timeout=10
using GIT_ASKPASS to set credentials
> git fetch --tags --progress https://github.com/LiuJunb/testweb.git +refs/heads/*:refs/remotes/origin/* > git rev-parse refs/remotes/origin/master^{commit} # timeout=10 > git rev-parse refs/remotes/origin/origin/master^{commit} # timeout=10 Checking out Revision 68edba65647b77c1cf78df941d5f73875a529da2 (refs/remotes/origin/master) > git config core.sparsecheckout # timeout=10 > git checkout -f 68edba65647b77c1cf78df941d5f73875a529da2 Commit message: "msg" > git rev-list --no-walk 7d7722b7c926d7f8688326ce40d3d1b51961e851 # timeout=10 [testweb] $ /bin/sh -xe /tmp/jenkins2081174913781868196.sh + pwd /var/lib/jenkins/workspace/testweb + ls package.json package-lock.json README.md src webpack.config.js + node -v v10.16.3 + npm -v 6.9.0 + git --version git version 1.8.3.1 + java -version java version "1.8.0_151" Java(TM) SE Runtime Environment (build 1.8.0_151-b12) Java HotSpot(TM) 64-Bit Server VM (build 25.151-b12, mixed mode) + echo 構建的版本號:3 構建的版本號:3 + npm install npm WARN testcssloader@1.0.0 No repository field. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"}) added 400 packages from 225 contributors in 22.49s + npm run build > testcssloader@1.0.0 build /var/lib/jenkins/workspace/testweb > webpack --mode production Hash: 8b18626cfb5996c8c259 Version: webpack 4.41.2 Time: 1150ms Built at: 10/21/2019 12:34:15 PM Asset Size Chunks Chunk Names bundle.js 6.93 KiB 0 [emitted] main Entrypoint main = bundle.js [0] ./src/main.js 249 bytes {0} [built] [1] ./src/common.js 148 bytes {0} [built] [2] ./src/main.css 1.05 KiB {0} [built] [3] ./node_modules/css-loader/dist/cjs.js!./src/main.css 174 bytes {0} [built] + 3 hidden modules + pwd /var/lib/jenkins/workspace/testweb + echo '----- 以上的列出的文件是 jenkin 服務 workspace 中 testweb 目錄下的文件-------' ----- 以上的列出的文件是 jenkin 服務 workspace 中 testweb 目錄下的文件------- Finished: SUCCESS - 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
2.查看構建的結果
查看 JenKins 安裝目錄下 workspace 目錄下的 testweb 項目
/var/lib/jenkins/workspace/testweb
- 1
1 ）構建時執行 npm install 后會生成 node_modules文件夾
2 ) 構建時執行 npm run build 后會生成 dist目標文件
生成 dist 目標文件后，如何部署項目？
8.構建后的操作
上面配置完構建的命令后，點擊立即構建，其實已經成功實現了自動化構建。但是項目只是完成了構建，還沒有完成項目的部署來。那么打包后生成的dist文件如何部署起來呢？這個時候需要配置一下 構建后操作 了。
1.安裝Publish over SSH插件
1）在線安裝
在系統管理->插件管理-> 可選插件 ->右邊搜索Publish over SSH-> 然后點擊直接安裝 ->安裝完成后重啟JenKins
2）或離線安裝
在系統管理->插件管理-> 高級 -> 在上傳插件中選擇離線插件（插件格式xxx.hpi） -> 然后點擊上傳 ->安裝完成后重啟JenKins
2.配置Publish over SSH
系統管理->系統設置->Publish over SSH->SSH Servers
-
指定遠程
web測試服務器的登錄密碼xxxxx -
指定遠程
web測試服務器的名稱 -
指定遠程
web測試服務器的 ip :xxx.xxx.xxx.xxx -
指定遠程
web測試服務器登錄的用戶名root -
指定遠程
web測試服務器部署的目錄(不是部署項目的名稱)/usr/local/webserver/nginx -
測試 JenKins 鏈接 遠程
web測試服務器是否成功
這里的 web測試服務器 和 JenKins所在的服務器是不同的兩個服務器。其中 JenKins所在的服務器是用來部署JenKins的，web測試服務器是用來部署前端項目的
3.添加構建后的操作
進入到 testweb任務 的配置頁面, 拉倒最底部
1）點擊 增加構建后操作步驟
2）選擇 Send build artifacts over SSH
沒有這個選項？檢查是否安裝了 Publish over SSH 插件
4.用Publish over SSH插件實現項目遠程部署
1） 第1步選擇遠程部署的服務器web測試服務器
（這個服務器是在：系統管理->系統設置->Publish over SSH->SSH Servers->name 指定的服務器的名稱。如果沒有指定是沒有下拉選項的）
2）第2步指定構建后/var/lib/jenkins/workspace/testweb/dist 目錄下所有的文件(包含dist目錄)上傳到遠程的web測試服務器。
3） 第3步指定忽略不上傳文件夾的前綴, 下面指定 dist 這個目錄不用上傳，只上傳dist目錄下所有的文件
4）第4步指定上傳到遠程web測試服務器的testweb目錄 。這個目錄沒有會自定新建。
testweb目錄是相對與：系統管理->系統設置->Publish over SSH->SSH Servers->Remote Directory指定的遠程服務器的路勁下創建的目錄。絕對路勁是：
/usr/local/webserver/nginx/testweb/
5） 第5步 指定發布后的操作，備份項目，並打印出回滾的命令。
6）配置完成，可以點擊立即構建測試
# 進入項目的文件夾 （ 項目路徑: /usr/local/webserver/nginx/testweb/testweb/xxxx ）
echo '--- 1.進入項目的文件夾：---'
cd /usr/local/webserver/nginx/testweb/testweb
pwd
# 打包壓縮項目文件
echo '--- 2.打包壓縮項目的文件：---'
# 自動創建testweb-copy文件夾，存在則創建失敗。mkdir -p a/b/c 創建多級目錄
mkdir /usr/local/webserver/nginx/testweb-copy
tar -zcvf /usr/local/webserver/nginx/testweb-copy/${JOB_NAME}-${BUILD_ID}.tar.gz *
# 查看壓縮備份后的文件
cd /usr/local/webserver/nginx/testweb-copy
echo '--- 3.下面是已經備份項目的版本：---'
ls
# 回復備份
echo '--- 4.下面是備份回滾的命令：---'
echo '刪除舊項目：rm -rf /usr/local/webserver/nginx/testweb/*'
echo '回滾指定版本: tar -zxvf /usr/local/webserver/nginx/testweb-copy/testweb-16.tar.gz -C /usr/local/webserver/nginx/testweb/'
echo '停止服務：/usr/local/webserver/nginx/sbin/nginx -s stop'
echo '重啟服務：/usr/local/webserver/nginx/sbin/nginx'
echo '--- 構建結束 ---'