jekyll部落格搭建之艱辛之路

weixin_33766168發表於2017-12-18

前言

其實每一個程式設計師都有著一顆Geek的心!

起由

話說，從2016年年初，我就一直有一個想法，就是搭建一個自己的部落格，讓自己更有歸屬感。但是奈何 理想太豐滿 一開始想的太多，想“完全自己搭建前後端，想...” 結果，一直想了好幾個月，也沒有開始行動(期間域名也買了好幾個，但是奈何備案手續太麻煩，一直沒有開始...)

某一天，我在知乎某貼上看到了"一系列的jekyll簡潔模板"。當時瞬間就被這些簡潔好看的模板給吸引住了，於是開始打算按照網上的大批教程，用jekyll搭建自己的部落格。

奈何，當時剛開始接觸jekyll，而且用的電腦又是windows，再加上按照各種教程倒騰了幾天無果後，暫時就放棄windows上用它了。

直到有一天，我翻出了那臺被棄用好幾個月的老舊本本，安裝了linux(ubuntu) 才終於按照教程成功的搭建了Jekyll部落格。

折騰了幾天後，算是對其中的緣由有了一定了解了，於是這次都重新試著在windows上弄jekyll。最終，不斷披荊斬棘，終於也成功的在windows上執行上了jekyll部落格。

本文正是基於以上情況，整理了自己在ubutun上，在windows上安裝jekyll的步驟以及一些可能遇到的問題，希望能對他人有所幫助！(最起碼自己以後再次倒騰時能根據本文正常搭建)

說明，本文只關注如何在本機執行起來jekyll部落格，至於如何用github pages託管jekyll部落格，相對簡單，就不再贅述了

另外，其實最近hexo也挺好的，只不過不是本文關注的內容

搭建jekyll前需要知道的一些知識

磨刀不誤砍柴功，理清楚以下關係後，對搭建jekyll是有好處的，方便自查可能的錯誤原因

ruby與ruby gem的關係

  • ruby是一種指令碼語言
  • ruby的其中一個“程式”叫rubygems，簡稱 gem(ruby 1.9.2及其以上就已經預設安裝了ruby gem的，所以無需再次手動安裝)

另外還有一個ruby bunder(rails框架中用來管理專案 的gem的，叫bundle)，在windows中搭建jekyll，需要安裝完ruby後用gem 安裝下bunder

ruby與jekyll的關係

jekyll是基於ruby的，所以搭建jekyll之前必須確保ruby正常安裝 注意，必須ruby大於2.0.0

jekyll與python的關係

jekyll3.0之前，有一個語法高亮外掛"Pygments"，這玩意是基於python的，所以才會有各種教程裡面都說搭建jekyll之前需要python環境

但是,請注意 jekyll3.0以後，語法高亮外掛已經預設改成了 “rouge‘ 而它是基於ruby的，也就是說 現在搭建jekyll,我們完全不必要再安裝python 這樣可以減少很大一部分工作量

為什麼ruby要改用source來源

不管是那一篇教程，都會告訴你安裝完ruby後需要通過gem命令將官方源改成淘寶源或[ruby china][]源，這是因為預設的官方源在國外，國內幾乎是無法訪問的(具體原因麼...)

所以才會必須改成其否源，否則無法使用，但是，請注意 現在淘寶源已經停止維護了，最新搭建jekyll 都應該要改成 [ruby china][]的源

http://gems.ruby-china.org

如何解決jekyll安裝過程中的問題

首先，在確保ruby(2.0.0以上)正常安裝，並且切換了ruby china源(或者淘寶源)後，其它遇到的所有問題幾乎都是 確實某些ruby程式的問題，所以只需要根據提示 通過相應命令，比如 gem install ... 即可解決

windows下還得確保DEVELOPMENT KIT正常安裝，並且正確配置

搭建jekyll的基本步驟

不論是windows上還是linux上，搭建jekyll基本都滿足如下步驟:

  • 安裝ruby(2.0.0以上)
  • 切換ruby的source來源
  • 通過gem命令安裝jekyll
  • github上fork心儀的jekyll模板，本地jekyll serve執行相應的部落格

另外，windows上還多了一步安裝DevKit-mingw 的過程

所以基本上來說，流程並不多，一遍完整走下來並費不了多少時間(但是網上教程良莠不齊，再加上官方教程都是英文，對於剛接觸jekyll，並且英語基礎不太好的人來說，確實很容易被消磨掉激情)

本文中涉及到的安裝系統與環境如下:

windows中:

  • win7 64位
  • rubyinstaller-2.0.0-p648-x64.exe
  • DevKit-mingw64-64-4.7.2-20130224-1432-sfx.exe

linux中:

  • ubuntu 14.04(LTS版)
  • ruby2.0.0

windows中搭建jekyll過程

說實話，剛開始在windows上安裝jekyll失敗之所以放棄，是因為剛接觸，對其中的關係不瞭解，不太會分析原因，再加上各種教程都說windows下會出問題，所以就被莫名的恐懼到了。

但實際上最後再次在windows上搭建時，發現要比linux上簡單(至少比ubuntu 14.04上簡單)，所以不管怎麼樣，要自己試過了才知道結果...

當然，也許是因為我目前用到的還不多，所以沒遇到那些傳說中的深坑...

第一步: 下載ruby2.0.0與Development Kit

如果求穩，最好還是推薦下載2.0.0(因為本文並沒有實踐過其它版本，當然自己願意搗鼓當然更好了~~)

  • [ruby下載][] (請根據自己的系統選擇相應ruby，裡面包括了ruby和DEVELOPMENT KIT的下載)

第二步: 安裝ruby2.0.0

下載完安裝包後，先安裝rubyinstaller, 記得儘量以管理員的許可權安裝 安裝時會有三個選項

  • Install Td/Tk support
  • Add Ruby executable to your PATH
  • Associate .rb and .rbw files width this Ruby installation

如果不明白意義，請全部選上(如果不選手，安裝後可能存在ruby不是可行命令等錯誤)。並且安裝完畢後，環境變數也會自動配置

如果安裝完後不放心，可以自行去windows中檢查環境變數的配置(主要就是Path中有沒有對應的值)，然後輸入ruby -v ,如果正常響應版本號則代表安裝正確

另外，本文中為了排除各種因素，ruby和Development Kit都是預設安裝在C盤的

第三步: 安裝Development Kit

安裝完ruby後，接著安裝DevKit(請確保管理員許可權安裝) 點選安裝，選擇完對應的目標後，點選確認即會自動提取

接下來找到安裝的目錄，如 C:\devkit 用windows的命令列執行->cmd即可進入命令列環境進入這個目錄，如 cd /d C:\devkit，即可立即進入這個目錄。

進入目錄後輸入 ruby dk.rb init 待執行完畢後，該目錄中會自動生成一個config.yml檔案(如C:devkitconfig.yml)

接下來，編輯這個檔案，修改成以下樣子

# This configuration file contains the absolute path locations of all
# installed Rubies to be enhanced to work with the DevKit. This config
# file is generated by the 'ruby dk.rb init' step and may be modified
# before running the 'ruby dk.rb install' step. To include any installed
# Rubies that were not automagically discovered, simply add a line below
# the triple hyphens with the absolute path to the Ruby root directory.
#
# Example:
#
# ---
# - C:/ruby19trunk
# - C:/ruby192dev
#
---

- C:\Ruby200-x64

其中唯一的修改就是在檔案末尾加上了 - C:\Ruby200-x64 這段代表加上自己的ruby路徑， 實際中可以將C:\Ruby200-x64改為自己的實際ruby目錄(層級大概是C:Ruby200-x64bin，在bin的上一級)

修改完畢後，繼續在本目錄下鍵入以下命令即可

ruby dk.rb install

一切順利後，就代表Development Kit已經正確安裝並配置

第四步: 更改預設的source源


鑑於官方源無法訪問，所以我們得更換為可以使用的源，這裡推薦使用[ruby china][]源，大致步驟如下

  • 先鍵入命令gem sources -l  檢視當前已經新增的源(預設應該是同時有官方源和淘寶源)
  • 然後通過 gem sources -r https://rubygems.org/ gem sources -r https://ruby.taobao.org/ 分別移除官方源和淘寶源 (注意，請對比實際，移除自己已經新增的源即可，可以改為自己上一步中查詢出來的地址)
  • 通過 gem sources -a http://gems.ruby-china.org 新增了[ruby china][]的可用源
  • 修改來源後可以通過gem sources -l 檢視是否正確修改

![rubysource][]

注意,上述的[ruby china][]源 我採用了http連結，這是因為我在windows中使用https時遇到了ssl問題，並且無法解決，如果你能正確解決，可以換為https連結

第五步: 安裝jekyll

安裝jekyll前先按照依賴包bundler，下述命令即可安裝

gem install bundler

之後，直接可以通過下述命令安裝jekyll

gem install jekyll

安裝需要一定的時間，過一段時間正常安裝後即代表jekyll可以開始使用了

第六步: 執行jekyll部落格

首先，你可以去[github][]上fork一個自己喜歡的jekyll模板，如果沒有自己喜歡的，可以考慮用我正在改造的模板 [mygithub][] (這個模板參考了3個人的原始碼，正在打算自己重寫前端原始碼，正在改造中，歡迎star和fork)

然後將對應的專案拷貝到自己本地的目錄下，同樣用cmd命令進入對應的目錄，比如 E:\tools\jekyll\project\dailc.github.io 然後執行 jekyll serve 過一會後如果有以下提示，則代表正常執行

Server address: http://127.0.0.1:4000/
Server running... press ctrl-c to stop.

另外，如果過程中遇到一些其它缺失元件的情況，可以通過相應的gem命令安裝

接下來，jekyll已經成功執行了，你可以自己做任意修改了(另外，請注意md檔案別用中文命名，否則可能會出錯- gbk to utf8的錯誤,而且儲存的檔案一定要是UTF-8 無 BOM格式，否則可能無法識別對應的文章)

另外，需要注意，windows下的jekyll是不支援自動監聽的...

效果預覽

大家也可以看下目前我搭建的jekyll blog (宣告，參考了多人原始碼，正在改造，最終的版本會與現在大不一樣)

關於jekyll new myblog可能遇到的問題

上述我之所以直接用已有的jekyll模板執行而不是直接用 jekyll new myblog來完成hello word專案，是因為這樣可能會遇到問題

我發現用上述命令搭建hello word專案時，總是提示

Gem::RemoteFetcher::FetchError: SSL_connect returned=1 errno=0 state=SSLv3 read
server certificate B: certificate verify failed

然後，我進到myblog目錄下，開啟了Gemfile檔案，發現原來裡面預設用了一個官方源source(如下)... 所以還是推薦大家使用已經搭建好的jekyll模板

source "https://rubygems.org"
ruby RUBY_VERSION

# Hello! This is where you manage which Jekyll version is used to run.
...

linux(ubuntu)中搭建jekyll過程

其實我最先是在linux上搭建成功的，那時候還順帶學了下git命令，總的來說，也是遇到了不少坑。

開始之前，慎重選擇linux系統

我一開始安裝的linux是ubuntu 13.04，然後一開始就發現這個版本14年1月份就已經停用了，然後開始找各種教程，最後能正常更新時發現，這個版本預設不帶ruby2.0.0(當時弄明白後只能繼續重灌能用的版本了...)

關於ubuntu版本號的選擇可以參考下 [ubuntu 版本支援][](最好使用LTS版本)

第一步: apt-get update並install ruby2.0

開始前先更新下，然後安裝 ruby2.0

sudo apt-get update
sudo apt-get install ruby2.0

最好通過su命令進入root許可權，另外可以通過 sudo passwd 設定root密碼

第二步: 強制更加ruby版本

上一步操作完了後，通過 ruby -v 檢視發現顯示的是 ruby 1.9.1，這時候請不要慌，其實2.0已經安裝完畢了的(14.04的情況下)

在14.04中，如果安裝ruby2.0，會預設同時安裝1.9.3和2.0.0，而且1.9.3會顯示成1.9.1，預設用的是1.9.3，所以才會出現這種情況

這時候，就需要我們強制更改ruby版本了，我們可以通過強制替換/usr/bin/目錄下與Ruby相關的符號連結到Ruby 2.0對應的版本，這樣即可實現預設版本的切換：(請注意備份，避免意外)

cd /usr/bin/
ln -sf ruby2.0 ruby
ln -sf gem2.0 gem
ln -sf erb2.0 erb
ln -sf irb2.0 irb
ln -sf rake2.0 rake
ln -sf rdoc2.0 rdoc
ln -sf testrb2.0 testrb

替換完成之後先更換官方源，參考windows下更換gem source(在上文)。之後更新下gem

gem update --system
gem pristine --all

這時Ruby的預設版本就已經切換到2.0了。當然雖然這樣做比較暴力，但也是可以還原的，如果想切換會Ruby 1.9.3，只需要執行（請注意在Ubuntu 14.04中，Ruby 1.9.3的名稱為ruby1.9.1）：

cd /usr/bin/
ln -sf ruby1.9.1 ruby
ln -sf gem1.9.1 gem
ln -sf erb1.9.1 erb
ln -sf irb1.9.1 irb
ln -sf rake1.9.1 rake
ln -sf rdoc1.9.1 rdoc
ln -sf testrb1.9.1 testrb

同樣的，再更新一下gem之後Ruby就又切換回1.9.3了。

更改完了後，可以通過 ruby -v檢視是否版本正確

第三步: 安裝jekyll

確保已經切換成了可用源(淘寶源或[ruby china][]源)，然後通過下述命令即可安裝jekyll

gem install jekyll -V

-V(大寫)代表檢視詳細進度

安裝完了後，和上文一樣，用自己喜歡的jekyll模板，然後執行jekyll serve即可檢視效果

(之後自己可以任意進行修改，以及新增自己想要的功能)

可能的錯誤以及解決

報錯:

rb can't find header files for ruby

解決:

apt-get install ruby2.0-dev（版本必須正確）

報錯:

缺少依賴rdiscount，這個是用來解析Markdown標記的解析包。

解決:

gem install rdiscount -V

mac中搭建jekyll過程

mac中比較方便，因為一般mac是自帶ruby和gem的

如果沒有ruby

brew install ruby

注意，gem安裝jekyll需要ruby 1.9.2以上版本，現在官方推薦的是1.9.3

如果版本低於，請升級

gem的換源

雖然自帶gems，但在國內，預設的源是被牆住的，因此需要重新設定淘寶源（感謝阿里）

gem sources --remove https://rubygems.org/
gem sources -a http://ruby.taobao.org/
gem sources -l

最後確保只剩一個淘寶源即可

安裝jekyll

gem install jekyll

安裝完後，即可使用了

jekyll build
jekyll server
...

許可權錯誤問題

如果遇到許可權問題，無法安裝上，可以使用管理員許可權安裝

sudo gem install jekyll

ruby版本過低問題

如果提示

requires Ruby version >= 2.1.

那麼是由於ruby版本過低造成的，更新ruby

1.先安裝rvm

curl -L get.rvm.io | bash -s stable

2.開啟rvm

source ~/.bashrc

source atom .bash_profile
(新增：export PATH=/usr/local/bin:$PATH)

source ~/.bash_profile

3.測試是否安裝正常

rvm -v

4.安裝homebrew

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

5.使用rvm安裝新版本的ruby

rvm install 2.2.4
或者
brew install ruby

6.檢測版本是否正常

ruby -v

其它報錯

如果遇到It looks like you don't have jekyll-paginate

gem install jekyll-paginate

總結

雖然說在windows上和linux上搭建 jekyll時遇到了各種各樣問題，但是最終都解決了，在解決的那一瞬間，其實是挺有滿足感的(大概這也是我喜歡搗鼓這些東西的願意之一吧)，而且確實感覺自己知識面比起以前還是有所擴充的。

所以不管怎麼樣，還是得多學！

結束語

你現在所學的知識，會在將來的某個時間段派上用場！

部落格

初次釋出2016.10.30於我個人部落格上面

jekyll部落格搭建之艱辛之路

相關文章