簡介

hexo —— 簡單、快速、強大的Node.js靜態博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在幾秒內，即可利用靚麗的主題生成靜態網頁。

特性

• 風一般的速度
  Hexo基于Node.js，支持多進程，幾百篇文章也可以秒生成。

• 流暢的撰寫
  支持GitHub Flavored Markdown和所有Octopress的插件。

• 擴展性
  Hexo支持EJS、Swig和Stylus。通過插件支持Haml、Jade和Less.

基本配置和使用的工具

操作系統：Windows 7

使用的工具：Git和Node.js

Git用于把部署在GitHub的內容獲取至本地，Node.js用于安裝Hexo。

基本步驟

安裝Git

• 安裝 Git,目前支持 Linux/Unix、Solaris、Mac和 Windows 平臺上運行

安裝Node.js

• 下載安裝文件，nodejs官網，我這里下載的是node-v6.11.2-x64.msi.

• 安裝nodejs

  雙擊”node-v6.11.2-x64.msi”，開始安裝nodejs，自定義安裝在D:\dev\nodejs下面。

  在cmd控制臺輸入：node -v，控制臺將打印出：v6.11.2，出現版本提示表示安裝成功。

  該引導步驟會將node.exe文件安裝到D:\dev\nodejs\目錄下，并將該目錄添加進PATH環境變量。

• 安裝相關環境

  npm install express -g npm install jade -g npm install mysql -g npm install coffee-script -g

  所有命令都是-g進行全局安裝的，這樣安裝的安裝包都在當前用戶下，在磁盤的所有其他地方都可以訪問到，比較方面。否則安裝在當前目錄下，只能在當前目錄下使用。

  默認情況下上述組件都是安裝在D:\dev\nodejs\node_modules文件夾下，這也是nodejs相關組件的自動查找路徑。確認安裝的命令：coffee -v，出現版本號表示成功安裝。

以上環境基本就配置完成

安裝Hexo

• 這一步的前提是必須先安裝 Node.js和Git

  1	npm install hexo -g

• 升級，更新hexo到最新版（升級僅需一步就把 Hexo 本體和所有相依套件安裝完畢）

  1	npm update hexo -g

• 安裝hexo-deployer-git，用于將博客的內容部署到git上

  1	npm install hexo-developer-git --save

• 初始化如果指定 <folder>，便會在目前的資料夾建立一個名為<folder>的新資料夾；否則會在目前資料夾初始化。在Git命令行窗口中輸入（指定 的方法是）：

  cd [需要指定的文件夾路徑]

• 跳轉到對應的文件夾目錄下后，進行初始化：

  hexo init

• 初始化后對應的資料夾中有一下文件（_config.yml, theme/, source/, scaffolds/, package.json, .gitignore）;文件作用：

  _config.yml：整個站點的配置，包括基本介紹，所使用的主題，關聯的倉庫等；

  theme/：所用的主題以及主題的配置；

  source/：目前所寫的所有文章以及404頁面等；

  scaffolds/：Hexo所提供的模板文件；

  package.json：說明站點使用了哪些包；

  gitignore：放置在git端時忽略的文件；

安裝Markdown編輯器

• 簡介：Markdown是一種可以使用普通文本編輯器編寫的標記語言，通過類似HTML的標記語法，它可以使普通文本內容具有一定的格式。git上上傳的文本一般都是用Markdown編輯的，而且它的語法也很簡單，所以這很實用。

• 安裝，下載地址，下載得到 markdownpad2-setup.exe，雙擊并完成安裝。

• 作用：由于使用Hexo寫博客，其中博客文章的格式就是.md格式，需要使用Markdown編輯器完成編輯，將純文本轉化為html，在瀏覽器上顯示出來。

• Markdown語法說明

安裝主題

可以到Hexo官網主題頁去搜尋自己喜歡的theme。我安裝的是hexo-theme-next。

next主題使用文檔：http://theme-next.iissnan.com/

hexo的next主題個性化教程:打造炫酷網站

發布文章

1） 新建文章

在對應的博客文件夾下的git-bash命令行中運行以下命令

$ hexo new "filename" #新建文章

新建文章之后，在博客對應的文件夾source\_posts中找到對應的.md文件，然后用Markdown編輯器打開，對文章內容進行編輯。

2）本地服務器上測試

保存文章后，在git-bash命令行中輸入以下命令

1 2 3 4 5 6 7

# 清除Hexo的緩存，包括 (db.json) 和已生成的靜態文件 (public) $ hexo clean $ hexo new "Hello World" # 創建新博客 $ hexo generate # 生成靜態網站，或者hexo g命令 $ hexo s # 打開本地服務器

伺服器會跑在 http://localhost:port （port 預設為 4000，可在 _config.yml 設定），可在本地訪問：http://localhost:4000

3）關聯遠程GitHub

• 修改_config.yml配置文科，終端cd到blog（這個是本地存放博客的文件夾，如beatriceblog）文件夾下，打開_config.yml，找到文件的最后兩行，修改成下邊的樣子：

  1 2 3 4

  deploy: type: git repository: https://github.com/jeasonstudio/jeasonstudio.github.io.git branch: master

> 非常重要：在配置所有的_config.yml文件時（包括theme中的），在所有的冒號:后邊都要加一個空格，否則執行hexo命令會報錯> 出現下列錯誤的解決方案1
2
3
4
5
# 生成網頁時，出現錯誤：ERROR Local hexo not found in ~/blog
npm install hexo --save

# 若執行命令hexo deploy仍然報錯：無法連接git，則執行如下命令來安裝hexo-deployer-git：
npm install hexo-developer-git --save

• 關聯GitHub賬號及倉庫

  • 根據已有的GitHub賬號，配置本地Git（其實就是建立本地Git與服務器上GitHub賬號的關聯）

    • 在本地創建ssh key：在本地的git bash命令窗口輸入下列命令，`your_email@youremail.com為你在github上注冊的郵箱，如beatrice.qq.com`

      1	$ ssh-keygen -t rsa -C [your_email@youremail.com]

    • 復制ssh key： ，輸入上面的命令后，會要求確認路徑和輸入密碼，我們這使用默認的一路回車就行。成功的話會在C:\Users\[本機的用戶名]下生成.ssh文件夾，進去，打開id_rsa.pub，所有的文件內容就是ssh key，復制下來。

    • 添加ssh key到Github：回到github網頁上，進入 Account Settings（賬戶配置），左邊選擇SSH Keys，Add SSH Key，title隨便填，粘貼電腦上生成的key，完成后就是下面的狀態。

    • 驗證是否成功，在git bash下輸入：

      1	$ ssh -T git@github.com

> 如果是第一次生成ssh key的會提示是否continue，輸入yes就會顯示已成功連上github。- 本地倉庫關聯github- **設置username和email**，因為github每次commit都會記錄他們1
2
$ git config --global user.name [your name]
$ git config --global user.email [your_email@youremail.com]
- **關聯遠程GitHub倉庫**，進入要上傳的本地倉庫所在目錄，右鍵打開git bash窗口，添加遠程地址： 1
2
3
4
$ git remote add origin git@github.com:yourName/yourRepo.git

# 例如，連接自己的博客遠程倉庫
git remote add origin git@github.com:dby124/dby124.github.io.git
> yourName和yourRepo表示你在github的用戶名和剛才新建的倉庫，加完之后進入.git，打開config，這里會多出一個remote "origin"內容，這就是剛才添加的遠程地址，也可以直接修改config來配置遠程地址。 - **創建新本地git倉庫**：進入要上傳的本地倉庫所在目錄，然后執行 `git init` 以創建新的 git 倉庫。 1
$ git init

• 參考GitHub簡明教程

4）部署到對應的網站上去

本地測試沒有問題后，執行下面命令

1 2	$ hexo g # 生成靜態網頁 $ hexo d #上傳到GitHub對應的倉庫中

自動備份Hexo博客源文件

• 安裝shelljs模塊

  1	npm install --save shelljs

  模塊安裝完成，在blog根目錄的scripts文件夾（如果沒有就新建一個）下新建一個js文件，文件名隨意取

• 修改腳本內容中，hexo的根目錄路徑

  1	cd('D:/nodejs/beatriceblog'); //此處修改為Hexo根目錄路徑

這樣，每次更新博文并deploy到服務器上之后，備份就會自動啟動并完成備份。

參考：hexo個人博客搭建教程

【Hexo+Github】域名和github綁定的問題

• 本地端

  在/blog/themes/landscape/source目錄下新建文件名為：CNAME文件，注意沒有后綴名！直接將自己的域名如：jeasonstudio.com寫入。

  終端cd到blog目錄下執行如下命令重新部署：

  1 2 3

  $ hexo clean $ hexo g $ hexo d

• 域名解析

  • 如果將域名指向一個域名，實現與被指向域名相同的訪問效果，需要增加CNAME記錄。
  • 登錄你注冊域名的網站，比如萬網，在你購買的域名后邊點擊：解析 –> 添加解析
  • 記錄類型：CNAME
  • 主機記錄：將域名解析為example.com（不帶www），填寫@或者不填寫
  • 記錄值：yourname.github.io. (不要忘記最后的，yourname改為你自己的用戶名)，點擊保存即可。

參考：【Hexo+Github】域名和github綁定的問題

總結

以上是生活随笔為你收集整理的使用Hexo搭建博客步骤详解的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。