披荊斬棘 使用Jekyll搭建個性化博客

前言

想了好久,想搭建屬於自己的個人博客,苦於沒有時間和精力自己遲遲沒有開始,因爲最近不是很忙,就開始着手使用Jekyll結合使用Github page 搭建個人博客,開始自己也沒接觸過Jekyll,弄了好幾天,查了許多資料,踩了不少的坑

準備

因爲Jekyll是基於Ruby開發的所以需要提前安裝Ruby

Ruby+devkit 2.6.3.1
官方下載地址:點擊這裏.
如果官方的下載速度慢,這裏我已經給大家下好了
本地地址:百度雲
提取碼:pfv0
還不是很瞭解Jekyll的小夥伴可以先看看Jekyll的官網再來搭建喲: Jekyll.
操作系統:Win10


注:Jekyll以前較低的版本需要安裝Ruby同時還需要安裝Python環境,這裏我使用的是Jekyll的最新版本,現在只需要Ruby環境,需要安裝老版本的的小夥伴只有自己探索了.

安裝Ruby與Jekyll

  1. 雙擊下載好的Ruby+devkit的安裝執行程序,傻瓜式安裝步驟
    最後到這個界面取消勾選點擊Finish
    最後到這個界面
  2. 查看是否安裝成功,打開命令行輸入 ruby -v
    在這裏插入圖片描述
  3. 檢查gem是否安裝完畢 : gem -v
    在這裏插入圖片描述
  4. 接着會打開一個命令行,輸入命令

ridk install

回車,顯示如下界面輸入 3 再回車,下載依賴

在這裏插入圖片描述
5. 加載完後會顯示如下效果,直接回車就可以了
在這裏插入圖片描述
6. 安裝Bundler

gem install bundler

在這裏插入圖片描述
7. 安裝jekyll

gem install jekyll
在這裏插入圖片描述

  1. 查看jekyll版本

jekyll -v

在這裏插入圖片描述

創建博客

  1. 進入自己想存放項目的目錄並在當前目錄中打開命令行或者直接打開命令行cd到指定目錄
  2. 數據命令:
jekyll new myblog(項目名稱)

在這裏插入圖片描述 等待數據下載完後進入項目根目錄輸入命令啓動項目

bundle exec jekyll serve

在這裏插入圖片描述
3. 運行成功
4. 瀏覽器輸入127.0.0.1:4000就會訪問到本地創建的博客頁面了
5. 如果你嫌默認的博客太單調,可以在Jekyll提供的主題網站進行下載

地址: Jekyll Themes.

  1. 下載下來後進入項目目錄查看是否有 Gemfile 文件,如果沒有可以從剛纔創建的項目中copy到該項目中在這裏插入圖片描述
  2. 再在當前項目目錄中打開命令行:輸入
bundle install   //構建項目的依賴

如果沒有進行上步的命令構建而就開始輸入運行項目的命令就會出現如下錯誤
在這裏插入圖片描述
8. 構建成功會出現下載好的所以依賴列表
在這裏插入圖片描述
9.再次輸入啓動命令:bundle exec jekyll serve在這裏插入圖片描述
注:如果命令行報如下錯誤:說明當前4000的端口被佔用了

error:permission denied -bind(2) for 127.0.0.1:4000

在這裏插入圖片描述
解決方法:打開命令行輸入

netstat -aon | findstr "4000"

查看端口
在這裏插入圖片描述
發現佔用4000端口的進程是2844

關閉衝突的進程 (進入任務管理器)
在這裏插入圖片描述
再次啓動項目就可以了
11.在瀏覽器地址欄中輸入

127.0.0.1:4000

在這裏插入圖片描述
預覽我的博客地址: 柏莫子的小黑屋.

踩過的坑

  1. 當執行 bundle install 命令的時候前期會較長時間處於下狀態
    在這裏插入圖片描述
    不要懷疑是否命令錯誤就立馬關掉,要有耐心,這個取決於你當前的網絡速度
  2. 當你從網上下載下來主題模板項目時有的項目中沒有 Gemfile文件 則就直接c按照上面的步驟操作,如果有則說明該項目裏存在jekyll的擴展插件,如果直接 構造項目 bundle install 則有可能會報某些插件不存在,如果沒有報錯請略過下面的步驟,
    (1)如果你已經構建了項目但是報錯了,想必根目錄中還自動生成 Gemfile.lok文件
    在這裏插入圖片描述
    先把該文件刪除,再把原本的 Gemfile 文件剪切在每個文件裏面,反正就在從該原本的項目中移除但是注意不是把他刪除了後面還有使用,在把開始自己默認創建的那個項目中的Gemfile文件copy到該項目中,記事本打開Gemfile文件,找到如下位置
    在這裏插入圖片描述
    把原本屬於該項目的 Gemfile 文件打開並找到相同的位置複製該內容,替換掉項目中這個位置的內容,這個位置就是該項目所需要的插件依賴,並且要和項目中 _config.yml 文件中的數據有的必須 Gemfile 文件中的都要有
    在這裏插入圖片描述
    再次構造項目 bundle install 就能構建成功了,再運行項目

注:如果自己在操作的時候命令輸出了或者其他因素導致錯誤,每次嘗試的時候都需要先刪除掉 項目中的 Gemfile .lok文件,因爲你每次構建的時候都會自動生成該文件並且你們已經產生了你錯誤的文件信息,所以重新構建是請務必先刪除該文件


如果有小夥伴們發現了什麼錯誤的表述,請大家多多指出,
若有什麼不明白的,大家可以給我留言一起交流學習,共同進步


github地址:RemainderTime.
個人博客地址:柏莫子的小黑屋(ps:還在完善中…)
網易雲音樂ID: remaindertime


一句激勵自己的話

傻逼一樣堅持,總會看見牛逼的結果

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章