首先你得注冊(cè)GitHub,然后creat repostory,取個(gè)名字~ 格式一般是[GitHub ID].github.io。比如我的ID是xxShen,名字就該是xxShen.github.io
-
安裝hexo
- 我們先來(lái)理理頭緒:
需求:一個(gè)靜態(tài)站用來(lái)存放前端文檔以及資料,那么一個(gè)靜態(tài)的博客站是個(gè)好選擇。
選擇:為什么是github pages,這是一個(gè)擁有免費(fèi)300m空間的,其次你可以通過(guò)github學(xué)習(xí)和鞏固git的用法,這貨可是主流啊~ 不管你是用來(lái)做版本控制管理還是自己練手的項(xiàng)目倉(cāng)庫(kù)。
hexo:上面提到了github pages,這玩意兒就是github的靜態(tài)站,夠用不夠美觀,hexo可以理解為github pages的升級(jí),比原生的更好用更好看。 - 安裝:
你得有node環(huán)境,安裝了git~
然后呢 在終端安裝hexo
- 我們先來(lái)理理頭緒:
$ npm install -g hexo
注意,這邊可能會(huì)出些問(wèn)題:
1.沒(méi)有權(quán)限 命令前加sudo
2.Mac的朋友需要裝xcode
3.python3的朋友可能會(huì)出現(xiàn)爆python的錯(cuò),去裝pyhon2.7!
4.以上問(wèn)題都解決了,你還被爆了一個(gè)
You have not agreed to the Xcode license agreements. You must agree to both license agreements below in order to use Xcode.
Hit the Enter key to view the license agreements at
'/Applications/Xcode.app/Contents/Resources/English.lproj/License.rtf'
這樣的錯(cuò)~
sudo xcodebuild -license accept
管上~
不要問(wèn)我為什么會(huì)知道有這么多抱錯(cuò)~
hexo -v
驗(yàn)證下hexo命令,順便看眼版本號(hào)。
* 讓我們來(lái)用用看~
* 命令分別為:
新建目錄
進(jìn)入目錄
hexo生成package.json文件
npm按照package.json去加載相應(yīng)的組件 完成~
啟動(dòng)服務(wù) 在瀏覽器輸入loaction:400
mkdir hexo-demo
cd hexo-demo
hexo init
npm install
hexo server
然后你就看到了自己的網(wǎng)站~
* 主題(皮膚)
* 什么!你說(shuō)丑?。磕阕约喝ジ臉邮胶美病?什么?。颗侣闊?? 好啦,我們來(lái)選個(gè)主題好了
([iissnan/hexo-theme-next · GitHub**](https://github.com/iissnan/hexo-theme-next), 470)
([TryGhost**](https://github.com/TryGhost)/**[Casper**]([iissnan/hexo-theme-next · GitHub**](https://github.com/iissnan/hexo-theme-next), 470)([TryGhost**](https://github.com/TryGhost)/**[Casper**](https://github.com/TryGhost/Casper)**, 439)([daleanthony**](https://github.com/daleanthony)/**[uno**](https://github.com/daleanthony/uno)**, 352)([orderedlist**](https://github.com/orderedlist)/**[modernist**](https://github.com/orderedlist/modernist)**, 286)([litten**](https://github.com/litten)/**[hexo-theme-yilia**](https://github.com/litten/hexo-theme-yilia)**, 265)([A-limon**](https://github.com/A-limon)/**[pacman**](https://github.com/A-limon/pacman)**, 243)([AlxMedia**](https://github.com/AlxMedia)/**[hueman**](https://github.com/AlxMedia/hueman)**, 215)([kathyqian**](https://github.com/kathyqian)/**[crisp-ghost-theme**](https://github.com/kathyqian/crisp-ghost-theme)**, 214)
hexo主題在github上的star排行榜 選取了star數(shù)超100的給大家參考,數(shù)據(jù)一致在變哦。
* 在你的hexo文件目錄里下載自己中意的主題
$ git clone https://github.com/iissnan/hexo-theme-next
接著在跟目錄的_config.yml文件里修改主題名,比如:theme: next
我在這時(shí)候遇到了一個(gè)問(wèn)題,這個(gè)配置文件里的內(nèi)容跟我的網(wǎng)站始終不匹配,不管 是主題還是title之類的。原因是現(xiàn)在的hexo 3.0有點(diǎn)問(wèn)題~ 官方的話:"Breaking Changes in Hexo 3.0" 在我看來(lái)就是個(gè)bug~
讓我們看看怎么解決它
https://github.com/hexojs/hexo/issues/1312
https://github.com/hexojs/hexo/wiki/Breaking-Changes-in-Hexo-3.0。
唔~ 這兩個(gè)都是答案~你需要
npm install hexo-deployer-git
然后hexo就很聽(tīng)話的去執(zhí)行你的配置文件了~
* 未完待續(xù)