Jenkins
更新地址：https://sunseekerx.yoouu.cn/common/jenkins.html
更新時間：2020-05-05 20:39:33
Vue項目自動化構建
Jenkins安裝查看Docker章節。
Jenkins第一次安裝完成最好重啓一下，因爲如果安裝了語言包有些地方還是英文的。應該是個bug。
前提
Vue項目+Git- 有
Jenkins環境 - 有部署項目的服務器
- 域名
- Linux知識
目標
在本地寫好代碼，一旦提交到Git，通過web-hook，觸發Jenkins的自動構建任務，Jenkins自動從Git上面拉取代碼>安裝依賴>打包>發送到部署的服務器等一系列操作。
簡單來說，我本地寫好代碼，我提交到
Git之後，就有個東西幫我打包發送到服務器。我不需要管這些事，我只要寫代碼、測試、推代碼就完事了。
目前需要實現的就是這樣的功能，但Jenkins能做的不只是這麼多。不過對於我目前的項目來說足夠了。
實現
0x1 安裝ssh發送插件 - Publish Over SSH
見名知意，通過
ssh發佈，用來將打包好的項目用ssh連接的方式發送到部署的服務器，並且執行其他的命令。
- 選擇系統管理
- 選擇插件管理
- 頁面直接
ctrl+f搜索ssh，直接安裝Publish Over SSH插件(不要用自帶的過濾搜索沒用)
0x2 配置ssh插件
這裏要配置的部署網站的服務器，我採用的方式是密碼登錄，也可以配置密鑰文件登錄的。看你的喜好。
- 選擇系統管理
- 選擇系統配置
- 拉到最後面找到
Publish over SSH - 新增
SSH - Server name標識該服務器的Hostname服務器的IPUsername填寫服務器的用戶- 點開高級設置
- 勾選
Use password authentication, or use a different key Passphrase填寫密碼- 填寫完了點擊
Test Configuration測試下是否連接成功
0x3 安裝nodejs插件
-
安裝
nodejs插件（Jenkins目前好像無法使用外部的nodejs）這個插件用來打包vue項目，跟我們自己本地執行
yarn build等命令無區別。- 選擇系統管理
- 選擇插件管理
- 頁面直接
ctrl+f搜索nodejs，直接安裝nodejs插件(不要用自帶的過濾搜索沒用) - 安裝完成
- 選擇系統管理
- 選擇全局工具配置
- 選擇新增 NodeJS
- 別名
node 12.16.3 - 勾選自動安裝
- 版本選擇
12.16.3，這是目前穩定的長期支持版本 - 保存
- 別名
新建項目配置
0x1 新建項目 - 選擇自由風格項目
0x2 輸入名稱
0x3 源碼管理選擇你的項目的Git
我的文檔項目訪問是公開的，可以直接訪問，如果是私有項目還需要配置一個可訪問的賬號纔可以。就是下面
Credentials選項。
0x4 構建觸發器
勾選
GitHub hook trigger for GITScm polling，這是一旦我們推送代碼就會觸發構建。
0x5 構建環境
勾選
Provide Node & npm bin/ folder to PATH，這是提供Node命令給我們使用。
0x6 增加構建步驟 - 執行shell
執行shell內容
由於內部的
node環境和外部隔離，所以我們第一次使用的時候需要安裝yarn和設置一些國內源。這一步我們進行安裝依賴和打包項目，並且將打包的項目壓縮等待後續發送到部署的服務器上。
# 進入Jenkins工作空間下hxkj項目目錄
cd /var/jenkins_home/workspace/sunseekerx
# 下面的命令只需要執行一次，後續可以刪除
###
# npm切換爲淘寶源
npm config set registry http://registry.npm.taobao.org/
# 安裝yarn
npm i yarn -g
# yarn切換爲淘寶源
yarn config set registry https://registry.npm.taobao.org
###
# 安裝項目中的依賴
yarn
# 打包
yarn build
# 進入生成打包文件的目錄
cd docs/.vuepress/dist
# 把生成的項目打包成壓縮包，方便移動到項目部署目錄
tar -zcvf sunseekerx.tar.gz *
執行完成之後會在服務器生成sunseekerx.tar.gz，下一步就是把這個文件發送到指定部署的服務器。進行解壓。
0x7 增加構建後的步驟
這一步將上一步打包好的文件發送到服務器，並且解壓。
cd /www/wwwroot/sunseekerx.yoouu.cn
\echo ">>>當前工作路徑："`pwd`
\shopt -s extglob
\echo ">>>刪除：(.htaccess|.user.ini|sunseekerx.tar.gz)之外的文件"
\rm -rf !(.htaccess|.user.ini|sunseekerx.tar.gz)
\echo ">>>解壓：sunseekerx.tar.gz"
\tar -zxvf sunseekerx.tar.gz -C ./
\echo ">>>移除：sunseekerx.tar.gz"
\rm -rf sunseekerx.tar.gz
\echo ">>>執行成功"
0x8 測試構建
可以看到服務器有了構建之後的文件
0x9 訪問下網站試試，nice😁
0x10 Git設置Webhooks
前提是Git需要能訪問到你的Jenkins，一旦有代碼提交上來，Git就會去請求你這個地址，然後Jenkins觸發構建動作。
簡單來說就是我提交代碼告訴
Git，Git告訴Jenkins你該構建了，完了Jenkins去構建。Git就像倉庫管理員，Jenkins就是幹苦力的。😁
0x10 測試下提交構建
在本地修改一些文件，提交上去，稍等一會兒查看Jenkins，這個處於等待中的任務就是提交的任務
訪問https://sunseekerx.yoouu.cn/試試，更新成功🤣
