用Github Page+Hexo搭建個人炫酷博客(基礎篇)

一直想搭建一個自己的博客,剛好之前也在學習使用Node.js和Git,看了看所以決定使用Github Page+Hexo搭建,這篇文章就記錄自己的搭建過程辣,方便以後進行知識回顧()。


準備工作

使用Github Page+Hexo搭建博客,需要進行以下準備工作。

  • 註冊自己的Github賬號
  • 下載Git
  • 下載Node.js
  • Markdown編輯器

下載以後可以自己先進行一些各個軟件基礎的使用學習熟悉一下啦。

Hexo

hexo是什麼?

Hexo 是一個快速、簡潔且高效的博客框架。Hexo 使用Markdown(或其他渲染引擎)解析文章,在幾秒內,即可利用靚麗的主題生成靜態網頁。

安裝

打開git bash,使用 npm 即可完成 Hexo 的安裝。

$ npm install -g hexo-cli
在這裏插入圖片描述

初始化

選擇一個盤建立一個博客站點的文件夾,我的是D盤,文件名就叫blog。
我已經進入blog這個文件夾了,執行以下命令

$ hexo init
$ npm install

執行完以上命令後,我的文件夾的目錄爲
在這裏插入圖片描述
各個文件夾的作用:

  • node_modules:這個用過nodejs的都知道啦嘿嘿

  • scaffolds:模版 文件夾。當您新建文章時,Hexo 會根據 scaffold 來建立文件。

  • source:資源文件夾是存放用戶資源的地方。除 _posts 文件夾之外,開頭命名爲 _ (下劃線)的文件 / 文件夾和隱藏的文件將會被忽略。Markdown 和 HTML 文件會被解析並放到 public 文件夾,而其他文件會被拷貝過去。

  • themes:主題 文件夾。Hexo 會根據主題來生成靜態頁面。

  • .gitignore:一般來說每個Git項目中都需要一個“.gitignore”文件,這個文件的作用就是告訴Git哪些文件不需要添加到版本管理中。

  • _config.yml:網站的 配置 信息,您可以在此配置大部分的參數。

  • package.json:應用程序的信息。

hexo初體驗

輸入以下命令

$ hexo g
$ hexo s

在這裏插入圖片描述
在這裏插入圖片描述

然後就可以在你的瀏覽器輸入http://localhost:4000,查看你的博客。
在這裏插入圖片描述

創建Github倉庫並關聯

創建時,填寫Repository name的時候,Repository name的格式必須爲賬戶名.github.io,,這是GitHub Pages的特殊命名規範。並且需要勾選Initialize this repository with a README。
在這裏插入圖片描述
複製這個新建倉庫的SSH地址
在這裏插入圖片描述
打開blog文件夾下的_config.yml,我是用sublime打開的,拉倒最下面,修改deploy爲以下代碼,repository後面的是你的倉庫地址。
在這裏插入圖片描述

如果使用git方式進行部署,執行npm install hexo-deployer-git --save來安裝所需的插件!!沒有的話會報錯的!!!
在這裏插入圖片描述

輸入以下命令部署到Github Page

$ hexo d

然後瀏覽器輸入username.github.io可以看到自己的博客啦!
在這裏插入圖片描述

hexo命令

$ hexo generate
生成靜態文件,簡寫爲$ hexo g
-d, --deploy 文件生成後立即部署網站
-w, --watch 監視文件變動

$ hexo publish [layout]
發表草稿。

$ hexo server
啓動服務器。默認情況下,訪問網址爲: http://localhost:4000/。
-p, --port 重設端口
-s, --static 只使用靜態文件
-l, --log 啓動日記記錄,使用覆蓋記錄格式

$ hexo deploy
部署網站。
-g, --generate 部署之前預先生成靜態文件
該命令可以簡寫爲:$ hexo d

$ hexo render [file2] …
渲染文件。
-o, --output 設置輸出路徑

$ hexo migrate
從其他博客系統 遷移內容。

$ hexo clean
清除緩存文件 (db.json) 和已生成的靜態文件 (public)。
在某些情況(尤其是更換主題後),如果發現您對站點的更改無論如何也不生效,您可能需要運行該命令。

$ hexo --config custom.yml
自定義配置文件的路徑,執行後將不再使用 _config.yml。

$ hexo --cwd /path/to/cwd
自定義當前工作目錄(Current working directory)的路徑。

$ hexo --safe
在安全模式下,不會載入插件和腳本。當您在安裝新插件遭遇問題時,可以嘗試以安全模式重新執行。

$ hexo list type
列出網站資料。

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