0. 說在前面的話(必看)
0.1. 思路總覽
使用hexo搭建Github page的思路如下:
其中我們把網(wǎng)站整個本體上傳到xiaohuilee.github.io
的hexo
分支;由hexo生成的靜態(tài)文件上傳到master
分支镊掖,hexo
分支的內(nèi)容用于維護Github Page本體丘喻,master
分支的內(nèi)容用于渲染Github Page。
0.2. 需要的必備兩個前提條件:
0.2.0. NodeJS
hexo是基于Node搭建的一套輕網(wǎng)絡(luò)框架话告,安裝依賴包以及安裝Hexo都需要用到node兼搏,為此Node是必須的。從官網(wǎng)下載并安裝Nodejs沙郭,直接下一步即可佛呻。
0.2.1. Git Bash
Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency.
Git is easy to learn and has a tiny footprint with lightning fast performance. It outclasses SCM tools like Subversion, CVS, Perforce, and ClearCase with features like cheap local branching, convenient staging areas, and multiple workflows.
下載鏈接在這里:
linux下的安裝(引用自官方文檔):
Debian/Ubuntu
For the latest stable version for your release of Debian/Ubuntu
sudo apt-get install git
For Ubuntu, this PPA provides the latest stable upstream Git version
sudo add-apt-repository ppa:git-core/ppa
sudo apt update;sudo apt install git
Fedora
yum install git (up to Fedora 21)
dnf install git (Fedora 22 and later)
Arch Linux
pacman -S git
1. 第一次安裝搭建Github Page
1.1. 創(chuàng)建repository
在github建立一個名為username.github.io的repository。
其中username為Github賬號名病线,比如我的是xiaohuilee.github.io吓著。
1.2. git clone你的博客項目地址
git clone https://github.com/XiaohuiLee/xiaohuilee.github.io.git
1.3. 切換分支
進入clone的項目目錄,注意此時是在master分支送挑,而master分支平常放生成的博客頁面夜矗,所以我們現(xiàn)在創(chuàng)建一個hexo分支,用來管理hexo相關(guān)文件让虐。
git checkout -b hexo
1.4. 安裝hexo紊撕,以及相關(guān)擴展依賴
建議把npm安裝源改為國內(nèi)的,淘寶就有提供赡突,這樣能提高安裝速度对扶。命令:npm config set registry https://registry.npm.taobao.org
区赵。
npm install -g hexo-cli
把當(dāng)前文件夾的文件都移到外面去(包括.git倉庫目錄)
hexo init // 初始化
初始化完成后馬上把文件移回來(一般只會有README.MD文件和.git目錄)
注意:hexo init要求當(dāng)前目錄是一個空目錄,否則git bash會報錯浪南。
npm install // 安裝依賴
npm install hexo-deployer-git --save // 安裝deployer擴展
1.5. 改變博客主題
我這里用的是:huno笼才。
首先克隆huno的github倉庫到本地。
git clone https://github.com/letiantian/huno.git themes/huno
1.6. 修改_config.yml文件
在根目錄xiaohuilee.github.io
下有配置文件_config.yml
络凿,里面存儲的是Hexo的一些配置信息骡送,使用vim _config.yml
打開編輯。
1.6.1. 修改主題
找到theme
一行絮记,修改成如下:
theme: huno
注意theme:
后面的空格不能省略摔踱。
1.6.2. 修改部署方式和部署目標(biāo)
deploy:
type: git
repo: https://github.com/XiaohuiLee/xiaohuilee.github.io.git
branch: master
1.6.3. 修改自己的個人信息
此外其他相關(guān)配置信息都改成你自己的,比如author這些怨愤。
1.6.4. 啟用圖片資源文件夾
對于那些想要更有規(guī)律地提供圖片和其他資源以及想要將他們的資源分布在各個文章上的人來說派敷,Hexo也提供了更組織化的方式來管理資源。這個稍微有些復(fù)雜但是管理資源非常方便的功能可以通過將config.yml
文件中的 post_asset_folder
選項設(shè)為 true
來打開撰洗。
當(dāng)資源文件管理功能打開后篮愉,Hexo將會在你每一次通過hexo new [layout] <title>
命令創(chuàng)建新文章時自動創(chuàng)建一個文件夾。這個資源文件夾將會有與這個 markdown 文件一樣的名字差导。將所有與你的文章有關(guān)的資源放在這個關(guān)聯(lián)文件夾中之后试躏,你可以通過下列標(biāo)簽引用方式來引用它們,這樣你就得到了一個更簡單而且方便得多的工作流设褐。
{% asset_img slug [title] %}
比如:
{% asset_img example.jpg This is an example image %}
1.7. 編寫第一篇博文
hexo new "your blog title"
然后會在source/_posts
下建立一個your-blog-title.md
的文件颠蕴,你可以編輯此文件書寫你想寫的博客內(nèi)容(Markdown格式)。
然后生成博客Html文件以及啟動本地測試的服務(wù)器络断。
hexo generate & hexo server
終端會提示:
INFO Generated: js/jquery.min.js
INFO Generated: images/background-cover.jpg
INFO 52 files generated in 2.25 s
INFO Start processing
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.
打開瀏覽器并訪問http://localhost:4000
就可以看到自己的博客了裁替。
到此為止项玛,我們已經(jīng)在本地測試成功編寫博客文章貌笨,接下來我們需要把整個網(wǎng)站內(nèi)容(src)部署到github上。
1.8. 部署到github
使用命令:
hexo generate -d
終端會嘗試生成網(wǎng)站靜態(tài)文件并彈出github用戶登錄窗口以供身份認證襟沮,輸入github用戶名和密碼就可以了锥惋。成功提示如下:
Branch 'master' set up to track remote branch 'master' from 'https://github.com/XiaohuiLee/xiaohuilee.github.io.git'.
To https://github.com/XiaohuiLee/xiaohuilee.github.io.git
d8b8f18..95710ab HEAD -> master
INFO Deploy done: git
1.9. 將網(wǎng)站本體提交到Github。
這是為了保持多終端編寫博客功能的必要條件开伏。
git add .
git commit -m 'hexo init'
git push -u origin hexo
注意上傳至hexo
分支
1.10. 此時可以在瀏覽器輸入xiaohuilee.github.io來訪問你的博客膀跌。
至此你的博客已經(jīng)成功搭建!
2. 在其他電腦上如何編寫博客并保持同步固灵。
2.1. clone自己Github上的博客倉庫
需要注意的是clone的應(yīng)該是hexo分支捅伤。
2.2. 安裝必備環(huán)境
npm install -g hexo-cli
npm install
npm install hexo-deployer-git --save
2.3. 正常博客書寫發(fā)布流程即可。
注意不要使用hexo init命令巫玻,因為倉庫中已存在丛忆。
hexo new "Another post"
//編寫完后
hexo generate -d
//部署完后記得把自己本體也上傳至hexo分支
git add .
git commit -m 'hexo updated from another pc'
git push -u origin hexo
完祠汇。