Hexo + Github Pages搭建個(gè)人獨(dú)立博客教程

一直想有一個(gè)高大上的方便寫博客的地方,去各大網(wǎng)站查探雏蛮,最終都不合心意。偶然發(fā)現(xiàn)GitHub這個(gè)空間站棉安,深受極客精神感染底扳,于是也來裝逼一把铸抑。下面是網(wǎng)上搜羅的資料整合贡耽,主要參考資料見文末。

一鹊汛、安裝Node.js
二蒲赂、安裝Git
三、安裝Hexo
1   $ cd d:/hexo
2   $ npm install hexo-cli -g
3   $ hexo init blog
4   $ cd blog
5   $ npm install
6   $ hexo g # 或者h(yuǎn)exo generate
7   $ hexo s # 或者h(yuǎn)exo server刁憋,可以在http://localhost:4000/ 查看
發(fā)表新文章

用hexo發(fā)表新文章

$ hexo n #寫文章 
Hexo主題設(shè)置

這里以主題hexo-theme-next為例進(jìn)行說明滥嘴。

  • 安裝主題
1   $ hexo clean
2   $ git clone https://github.com/iissnan/hexo-theme-next themes/hexo-theme-next
  • 啟用主題
    修改Hexo目錄下的_config.yml配置文件中的theme屬性,將其設(shè)置為hexo-theme-next至耻。
  • 更新主題
1   $ cd themes/hexo-theme-next
2   $ git pull
3   $ hexo g # 生成
4   $ hexo s # 啟動(dòng)本地web服務(wù)器

現(xiàn)在打開http://localhost:4000/ 若皱,會(huì)看到我們已經(jīng)應(yīng)用了一個(gè)新的主題镊叁。

使用hexo deploy部署

hexo deploy可以部署到很多平臺(tái),具體可以參考這個(gè)鏈接. 如果部署到github走触,需要在配置文件_config.xml中作如下修改:

1   deploy:
2   type: git
3   repo: git@github.com:particleD/particleD.github.io.git
4   branch: master

然后在命令行中執(zhí)行

1   hexo d

即可完成部署晦譬。

1)注意需要提前安裝一個(gè)擴(kuò)展:

1   $ npm install hexo-deployer-git --save

使用git命令行部署(optional)
不幸的是,上述命令雖然簡(jiǎn)單方便互广,但是偶爾會(huì)有莫名其妙的問題出現(xiàn)敛腌,因此,我們也可以追本溯源惫皱,使用git命令來完成部署的工作像樊。

clone github repo
1   $ cd d:/hexo/blog
2   $ git clone https://github.com/particleD/particleD.github.io.git .deploy/particleD.github.io

將我們之前創(chuàng)建的repo克隆到本地,新建一個(gè)目錄叫做.deploy用于存放克隆的代碼旅敷。
創(chuàng)建一個(gè)deploy腳本文件

1   hexo generate
2   cp -R public/* .deploy/particleD.github.io
3   cd .deploy/particleD.github.io
4   git add .
5   git commit -m “update”
6   git push origin master

簡(jiǎn)單解釋一下生棍,hexo generate生成public文件夾下的新內(nèi)容,然后將其拷貝至particleD.github.io的git目錄下扫皱,然后使用git commit命令提交代碼到particleD.github.io這個(gè)repo的master branch上足绅。
需要部署的時(shí)候,執(zhí)行這段腳本就可以了(比如可以將其保存為deploy.sh)韩脑。執(zhí)行過程中可能需要讓你輸入Github賬戶的用戶名及密碼氢妈,按照提示操作即可。

插入圖片

經(jīng)過上面的一系列安裝配置過程段多,實(shí)現(xiàn)了自由主題切換首量,一鍵式Deploy。然而进苍,還有一點(diǎn)小遺憾加缘,博客上放本地圖片仍然是個(gè)問題。于是找到下面的解決方案觉啊,贊一個(gè)拣宏。

CodeFalling/hexo-asset-image的插件來加載本地圖片。使用方法
1.首先確認(rèn) _config.yml 中有 post_asset_folder:true杠人。
Hexo 提供了一種更方便管理 Asset 的設(shè)定: post_asset_folder
當(dāng)您設(shè)置 post_asset_foldertrue參數(shù)后勋乾,在建立文件時(shí),Hexo
會(huì)自動(dòng)建立一個(gè)與文章同名的文件夾嗡善,您可以把與該文章相關(guān)的所有資源都放到那個(gè)文件夾辑莫,如此一來,您便可以更方便的使用資源罩引。
2.在hexo的目錄下執(zhí)行npm install https://github.com/CodeFalling/hexo-asset-image --save(需要等待一段時(shí)間)各吨。
3.完成安裝后用hexo新建文章的時(shí)候會(huì)發(fā)現(xiàn)_posts目錄下面會(huì)多出一個(gè)和文章名字一樣的文件夾。圖片就可以放在文件夾下面袁铐。結(jié)構(gòu)如下:

  • 本地圖片測(cè)試

    ├── apppicker.jpg
    ├── logo.jpg
    └── rules.jpg

  • 本地圖片測(cè)試.md
    這樣的目錄結(jié)構(gòu)(目錄名和文章名一致)揭蜒,只要使用 ![](本地圖片測(cè)試/logo.jpg) 就可以插入圖片横浑。其中[]里面不寫文字則沒有圖片標(biāo)題。
    生成的結(jié)構(gòu)為
    public/2016/3/9/本地圖片測(cè)試

├── apppicker.jpg
├── index.html
├── logo.jpg
└── rules.jpg

同時(shí)屉更,生成的 html 是

![](/2016/3/9/本地圖片測(cè)試/logo.jpg)
參考:

1.https://linghucong.js.org/2016/04/15/2016-04-15-hexo-github-pages-blog/
2.http://www.reibang.com/p/c2ba9533088a

本想著搭一個(gè)高大上的屬于自己的空間伪嫁,可是對(duì)比起能夠直接復(fù)制粘貼圖片的簡(jiǎn)書,懶惰使我放棄了Github的使用偶垮。于是將此文作為簡(jiǎn)書上的第一篇博客张咳,作為我反反復(fù)復(fù)尋找博客安生之所的記錄。我就想開開心心簡(jiǎn)簡(jiǎn)單單的寫點(diǎn)東西似舵。

PS:
簡(jiǎn)書上使用markdown插入公式可以使用Google Chart的服務(wù)器或者LaTeX(看到LaTeX簡(jiǎn)直倍感親切)脚猾。

![](http://chart.googleapis.com/chart?cht=tx&chl= $$y=exp^{-x}$$)
![](http://latex.codecogs.com/png.latex?$$y=exp^{-x}$$)

顯示為
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市砚哗,隨后出現(xiàn)的幾起案子龙助,更是在濱河造成了極大的恐慌,老刑警劉巖蛛芥,帶你破解...
    沈念sama閱讀 223,002評(píng)論 6 519
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件提鸟,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡仅淑,警方通過查閱死者的電腦和手機(jī)称勋,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,357評(píng)論 3 400
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來涯竟,“玉大人赡鲜,你說我怎么就攤上這事÷” “怎么了银酬?”我有些...
    開封第一講書人閱讀 169,787評(píng)論 0 365
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)筐钟。 經(jīng)常有香客問我揩瞪,道長(zhǎng),這世上最難降的妖魔是什么篓冲? 我笑而不...
    開封第一講書人閱讀 60,237評(píng)論 1 300
  • 正文 為了忘掉前任李破,我火速辦了婚禮,結(jié)果婚禮上纹因,老公的妹妹穿的比我還像新娘喷屋。我一直安慰自己琳拨,他們只是感情好瞭恰,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,237評(píng)論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著狱庇,像睡著了一般惊畏。 火紅的嫁衣襯著肌膚如雪恶耽。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,821評(píng)論 1 314
  • 那天颜启,我揣著相機(jī)與錄音偷俭,去河邊找鬼。 笑死缰盏,一個(gè)胖子當(dāng)著我的面吹牛涌萤,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播口猜,決...
    沈念sama閱讀 41,236評(píng)論 3 424
  • 文/蒼蘭香墨 我猛地睜開眼负溪,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了济炎?” 一聲冷哼從身側(cè)響起川抡,我...
    開封第一講書人閱讀 40,196評(píng)論 0 277
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎须尚,沒想到半個(gè)月后崖堤,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,716評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡耐床,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,794評(píng)論 3 343
  • 正文 我和宋清朗相戀三年密幔,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片撩轰。...
    茶點(diǎn)故事閱讀 40,928評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡老玛,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出钧敞,到底是詐尸還是另有隱情蜡豹,我是刑警寧澤,帶...
    沈念sama閱讀 36,583評(píng)論 5 351
  • 正文 年R本政府宣布溉苛,位于F島的核電站镜廉,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏愚战。R本人自食惡果不足惜娇唯,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,264評(píng)論 3 336
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望寂玲。 院中可真熱鬧塔插,春花似錦、人聲如沸拓哟。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,755評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至流纹,卻和暖如春糜烹,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背漱凝。 一陣腳步聲響...
    開封第一講書人閱讀 33,869評(píng)論 1 274
  • 我被黑心中介騙來泰國(guó)打工疮蹦, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人茸炒。 一個(gè)月前我還...
    沈念sama閱讀 49,378評(píng)論 3 379
  • 正文 我出身青樓愕乎,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親壁公。 傳聞我的和親對(duì)象是個(gè)殘疾皇子妆毕,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,937評(píng)論 2 361

推薦閱讀更多精彩內(nèi)容