利用Travis IC實現Hexo博客自動化部署

1.Hexo博客的利與弊

Hexo中文

我就默認爲看到這篇文章的人都比較瞭解Hexo博客,也都能夠成功手動部署吧。所以第一部分推薦兩篇文章一筆帶過,讓我們快速進入本文的重點內容。實在不知道也不要方先看一看下面推薦的這兩篇文章。

手把手教你使用Hexo Github Pages搭建個人獨立博客——令狐蔥

Hexo github 打造個人博客——zdy0_2004

還有一個專欄:Hexo / 總共13篇——水寒

感謝以上文章原創作者的分享,推薦純屬自來水。看完這兩篇文章後有沒有覺得自己手裏的Hexo博客非常神奇、非常好用了呢?其實我想說,這個時候的Hexo只是一個殘廢好嗎?你想一想,玩這個博客系統的你一定是熱愛技術的折騰客,比如小明有8臺電腦,他要在8臺電腦上都安裝環境,而且部署還真是個磨人的小妖精,很可能會出現奇奇怪怪的問題。比如在剛接觸Hexo不久的時候我幹過這樣一件純事,配置文件_conffig.yml中有這樣一段代碼:

language: cn
timezone: Asia/Shanghai

我就自作多情地把時區改成Beijing了,之後就出現了無法部署的問題。好久以後一個機會看到別人的文章才明白這個時區是改不得的,醉的是,出錯以後新手真的很難知道錯誤原因。所以如果不能跨終端寫作、自動部署,Hexo的博客功能算什麼呢?算殘廢,沒錯!

針對以上問題,我們今天就來交流一下利用Travis IC實現Hexo博客自動化部署,這樣乾的好處就是終於可以實現多終端發佈博客文章而不用換一次電腦裝一次環境了。

2.Travis IC解決問題

這裏我們就暫時不介紹Travis IC了,感興趣可以到文章後面瞭解一下,我們直接用它來解決問題。

2.1備份

Hexo博客源文件和Github Pages 倉庫文件(生成的網站靜態頁文件)。若你更換了電腦,首先要把源文件拷貝到新電腦裏,然後把GitHub Page的倉庫clone到本地。最終本地要形成這樣兩個文件夾

2.2備份上傳

將備份的文件上傳到GitHub。由於Github Pages 倉庫使我們剛剛拷貝下來的,所以不用管它,重點是源文件。這個時候你就用兩種選擇:第一種是常見的做法:在Github Pages 倉庫直接新建分支,將源文件上傳到分支當中。第二種是本文要介紹到的方法:直接新建倉庫,將源文件上傳到新倉庫當中。其實這兩種方法操作上可以說幾乎完全一樣,區別是方法二可以新建私有倉庫,別人是看不到你的源文件的。

先不要着急作出選擇,選擇方法二你要清楚,Travis CI 的網站有兩個,travis-ci.org 專門針對開源項目,Github 上所有的公開倉庫都能夠免費使用;travis-ci.com 針對私有及商業項目,新用戶前 100 次構建是免費的,後面就要收費了。

也就是說,如果你不是GitHub Pro,那麼還是選擇第一種方法或者第二種方法設置公開倉庫,且要在travis-ci.org中操作。

2.3登錄 Travis CI 網站、

訪問travis-ci.org 或者 travis-ci.com“Sign up with Github”使用自己的 Github 帳號登錄。接下來到github就可以 到Applications 中找到 Travis CI 。點擊congigure,給它我們備份好源文件倉庫的訪問權限。

2.4Travis CI基本配置

爲了能夠實現代碼推送到 Github,需要給 Travis CI Github 的 Persional access tokens,在 settings- Developer settings 可以生成一個。給repo權限即可注意:生成的 token 只會顯示一次,所以一定要及時保存下來,否則就只能刪除重新創建了。

然後進入 Travis 中的項目設置界面,可以給具體的代碼庫進行設置,比如增加環境變量:在 Travis CI 中可以通過設置環境變量來傳遞一些不便於寫在配置文件中的值(密碼、密鑰之類的),在這裏我們設置 GH_TOKGH 環境變量分別用來傳遞 GitHub Personal Access Token 。注意:如果你在這裏設置的環境變量名不是這兩個,下文的.travis.yml配置的時候要與你的變量名對應。

最後還在 Travis 倉庫配置界面more option--ssetting裏面 環境變量Environment Variables進行配置token方便在構建文件中引用,NAME命名爲GH_TOKGH,如下圖

2.5配置.travis.yml

在博客的源碼文件分支下添加.travis,yml配置文件,決定怎麼執行構建任務。下面是.travis,yml的內容:

language: node_js
node_js: stable

cache:
    apt: true
    directories:
        - node_modules

notifications:
    email:
        recipients:
            - [email protected] #你的郵箱地址
        on_success: change
        on_failure: always

# turn off the clone of submodules for change the SSH to HTTPS in .gitmodules to avoid the error
git:
  submodules: false
        
before_install:
    - export TZ='Asia/Shanghai'
    - npm install hexo-cli -g

install:
    - npm install

script:
    - hexo clean
    - hexo g

after_script:
  - cd ./public
  - git init
  - git config user.name "xxx"
  - git config user.email "[email protected]"
  - git add .
  - git commit -m "Update blog content by Travis CI"
  - git push --force --quiet "https://${GH_TOKEN}@${GH_REF}" master:master

branches:
    only:
        - master

env:
    global:
        # Github Pages
        - GH_REF: github.com/xxxr/xxx.github.io.git
        # Coding Pages
        - CD_REF: git.coding.net/xxxr/xxx.git

代碼中另一個環境變量名GH_REF爲 Github Pages 倉庫地址`env`中有賦值。注意:xxx是你的GitHub用戶名,[email protected]替換成你在GitHub的註冊郵箱

2.5測試

網上流傳着一種很常見的.travis.yml配置代碼,你可以輕鬆搜索到,很多人在用,但在我這裏卻行不通。通過push本地代碼到GitHub等30多秒看Travis CI的反應,這個過程如果總是報錯的話……那是真的爽啊!

百折千回,慢慢嘗試,也參考了不少大佬的代碼最終在用上面的給出的代碼成功18次!妥妥的18次,如果你也踩了坑,不要心急,請嘗試修改、調整18次。

3.經驗總結

3.1換電腦以後SSH key重新申請

3.1.1生成新的 SSH Key

$ ssh-keygen -t rsa -C "郵件地址@youremail.com"

如圖所示:

然後要輸入密碼,如果爲空的話提交項目時則不用輸入。這個設置是防止別人往你的項目裏提交內容。

Enter passphrase (empty for no passphrase):<輸入加密串>
Enter same passphrase again:<再次輸入加密串>

祕鑰生成以後在你的C:Users你的用戶名.ssh下可以看到如下文件然後你可以複製id_rsa.pub 裏的內容,或者在Git Bash裏繼續執行代碼同樣可以把祕鑰複製到剪切板。

clip < ~/.ssh/id_rsa.pub

3.1.2在GitHub設置中添加key

登陸 GitHub 系統。點擊右上角的 Account Settings--->SSH Public keys ---> add another public keys

3.1.3粘貼祕鑰並保存

把你本地生成的密鑰複製到裏面( key 文本框中), 點擊 add key

3.1.4測試

ssh -T [email protected]

出現下圖所示提示,證明祕鑰配置成功!

3.2換電腦以後備份上傳博客源文件

在進行步驟2.2備份上傳的時候,由於我是新換了電腦,能從倉庫pull下來但無法push到倉庫上去。

原因是沒有對Git文件或文件夾進行申明,還是對Git不熟悉造成的,其實挺有一意思,總結這三板斧的步驟就是,先git init初始化環境,然後選擇要執行的文件範圍,git add .意思是全部選擇,然後申明,最後選擇推拉。具體說明請看下圖。push成功是這個樣子的:、

3.3Travis IC介紹

Travis IC=Travis Continuous Integration 意思是,在一個項目中,任何人對代碼庫的任何改動,都會觸發 CI 服務器自動對項目進行構建,自動運行測試,自動編譯,甚至自動部署到測試環境。這樣做的好處就是,隨時發現問題,隨時修復。因爲修復問題的成本隨着時間的推移而增長,越早發現,修復成本越低。Travis CI 是在線託管的 CI 服務,用 Travis 來進行持續集成,不需要自己搭服務器。另外,GitHub推出了官方的自動編譯項目——GitHub Actions,詳情請參考下面這兩篇文章瞭解:

GitHub Actions 入門教程——阮一峯

Github Actions:再次改變軟件開發——編譯青春

4.參考文章

Github 使用 Travis CI 實現 Hexo 博客自動部署——Michael翔

使用 Travis CI 實現 Hexo 博客自動部署——昔日的夕日(這篇文章部分地方有錯誤,要自行辨別)。

利用CI自動部署hexo博客——一步

使用Travis CI自動部署博客到github pages和coding pages——Akkuman

好的,到這裏我們這篇交流文章就結束了。菜鳥的學習文章,不足之處還望各位大神斧正。

發佈了5 篇原創文章 · 獲贊 3 · 訪問量 784
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章