Hexo是一款基于 Node.js 的靜態(tài)博客框架, 目前在 GitHub 上已有 9133 star 和 1499 fork。Hexo 生成的靜態(tài)頁面可以部署在 Github 或 Coding 上,并且能夠免費綁定自己的域名,可以用來很方便地搭建個人博客。
一、安裝 Git
搭建博客需要用到 git,下面這條命令可查看本機是否已安裝 git倡蝙,若未安裝可參考這篇博文進行安裝。
git --version
二绞佩、安裝 Node.js
安裝 Node.js 的最佳方式是使用 nvm寺鸥。
cURL:
$ curl https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh
Wget:
$ wget -qO- https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh
安裝完成后,重啟終端并執(zhí)行下列命令即可安裝 Node.js品山。
$ nvm install stable
或者您也可以下載 安裝程序 來安裝胆建。
三、安裝 Hexo
所有必備的應(yīng)用程序安裝完成后肘交,即可使用 npm 安裝 Hexo笆载。
$ npm install -g hexo-cli
以上安裝配置如有問題請參考官方文檔
四、本地建立博客
安裝完成后涯呻,新建一個目錄如 blog 用于存放博客凉驻,切換到該目錄下執(zhí)行以下指令,Hexo 即會在目標文件夾初步生成博客所需要的所有文件
hexo init
然后切換到該目錄下執(zhí)行如下命令复罐,安裝所需要的依賴
sudo npm install
生成靜態(tài)頁面
hexo g
啟動本地服務(wù)
hexo s
生成靜態(tài)頁面與啟動本地服務(wù)可以結(jié)合成以下指令
hexo s -g
打開瀏覽器涝登,輸入 http://localhost:4000/ ,看到頁面說明hexo環(huán)境安裝成功市栗。
四缀拭、NexT主題配置
- 安裝
將它的 Git 倉庫 Clone 以后放到博客目錄下的 themes 文件夾中即可
git clone https://github.com/iissnan/hexo-theme-next themes/next
- 啟用
與所有Hexo主題一樣咳短,把主題源碼導入themes目錄后填帽,打開根目錄配置文件_config.yml
, 找到 theme 字段咙好,并將其值更改為 next 就完成了主題的切換篡腌。
theme: next
四、部署到Coding Pages
在 Coding 新建一個項目勾效,假設(shè)為 blog嘹悼,然后修改本地博客目錄下的 _config.yml 文件,根據(jù)官方文檔的描述层宫,修改以下幾個參數(shù)杨伙,這些參數(shù)一般在文件底部:
deploy:
type: git #部署方式,這里我們用的是Coding的Git
repo: <repository url> #倉庫地址萌腿,例如我的是git@git.coding.net:xxx/blog.git
branch: [branch] #分支名限匣,可任意填寫,我填寫的是master
message: [message] #可不填毁菱,這是顯示在提交記錄里的描述信息米死,默認為日期
參數(shù)修改完成后锌历,我們需要在終端中切換到博客所在目錄安裝 deploy 組建,執(zhí)行以下命令將生成的博客靜態(tài)頁面 push 到我們上面在 Coding 創(chuàng)建的 blog 倉庫中:
sudo npm install hexo-deployer-git --save
然后執(zhí)行依次執(zhí)行清理命令
hexo clean
生成命令:
hexo g
部署命令:
hexo d
如果在 _config.yml 的 repo 處填寫的倉庫地址是 https 形式的峦筒,在部署時可能需要輸入你的 Coding 賬號和密碼究西。
然后切換到該項目的 Pages 標簽,開啟 pages 服務(wù)物喷,分支名填寫為我們在_config.yml 文件中設(shè)定的分支卤材,我的是 master。
五峦失、效果預覽
pages 服務(wù)開啟完成后商膊,Coding 會提供一個類似 {user_name}.coding.me/{project_name} 的鏈接用于訪問,例如用戶名為 xxx 項目名為 blog 的鏈接應(yīng)該是:
http://xxx.coding.me/blog
若資源加載失敗宠进,主題沒有顯示出來晕拆,查看根目錄配置文件_config.yml
url: http://xxx.coding.me/blog/ #項目地址
root: /blog #項目名稱
六、綁定域名
默認提供的鏈接可能過長或者不便于日常使用材蹬,我們也可以綁定自己的域名实幕。首先,需要提前準備一個域名堤器,然后打開自己的域名控制面板昆庇,新建一個 CNAME 解析到 {user_name}.coding.me,例如我的是將 www.xxx.com 解析到 xxx.coding.me闸溃; 然后整吆,打開 Coding 項目頁面切換到 pages 項,填入剛才的設(shè)置解析的域名 www.xxx.com辉川,點擊“添加域名綁定”按鈕即可表蝙,在瀏覽器中直接訪問 www.xxx.com 就能成功打開。 有時可能由于緩存或者解析時間的問題乓旗,稍等片刻即可府蛇。
七、撰寫博客
hexo new "postName" #新建文章
hexo new page"pageName" #新建頁面
hexo generate #生成靜態(tài)頁面至public目錄
hexo server #開啟預覽訪問端口(默認端口4000屿愚,'ctrl + c'關(guān)閉server)
hexo deploy #將.deploy目錄部署到指定空間
hexo help # 查看幫助
hexo version #查看Hexo的版本
- 使用命令直接創(chuàng)建一篇文章
hexo new "Hello Word"
成功后我們會在source文件夾下的_posts文件夾中找到我們剛剛創(chuàng)建的文件Hello Word.md汇跨,編寫格式為markdown, 打開文件即可直接編寫
- 手動在_posts文件夾下創(chuàng)建*.md文件的博客,但是我們自己要把頭信息給補上
部署博客
hexo d -g