『Hexo』使用Hexo搭建GitHub博客
前言：
? 談起這個(gè)博客的由來(lái)坯苹，真的挺不容易的绎签。一年前興奮地買(mǎi)了域名勒奇，后來(lái)因?yàn)楹芏鄸|西都不具備實(shí)現(xiàn)這個(gè)模版博客的能力甩十，遂擱置了域名，選擇了簡(jiǎn)書(shū)坪郭。有點(diǎn)笨个从，這一次也折騰了兩三個(gè)晚上，總算把它搭建起來(lái)了。
環(huán)境準(zhǔn)備
- git搭建 ：git教程
- node.js : node.js download
- git主要用于將代碼同步到GitHub平臺(tái)嗦锐，node.js主要用到了npm這個(gè)包管理器嫌松，方便我們快速搭建Hexo環(huán)境。
- 個(gè)人的主機(jī)環(huán)境為：MacOS
注冊(cè)Github
- 我們的主要目的就是把本地的靜態(tài)網(wǎng)站托管到GitHub這個(gè)平臺(tái)上奕污。
- Tips: 我遇到的一個(gè)坑就是萎羔，我用的是QQ郵箱注冊(cè)，GitHub驗(yàn)證郵件被攔截了碳默，貌似163郵箱也會(huì)攔截贾陷。一定要驗(yàn)證郵箱，否則即使你博客搭建好了嘱根，托管到GitHub上面髓废，也會(huì)一直404無(wú)法打開(kāi)。
Quick Start
- 安裝Hexo
sudo npm install hexo-cli -g
Hexo官方文檔：Hexo
- 利用Hexo初始化一個(gè)博客文件夾
hexo init [文件夾]
-
npm install命令用來(lái)安裝模塊到node_modules目錄儿子。
cd [文件夾] //進(jìn)入到博客文件夾
npm install //利用npm install命令安裝模塊node_modules
關(guān)于npm的詳細(xì)使用瓦哎，參照文檔砸喻，或者npm 模塊安裝機(jī)制簡(jiǎn)介柔逼。
至此，一個(gè)博客已經(jīng)搭建好了割岛，但是我們還沒(méi)辦法看到它愉适。接下來(lái)就利用Hexo命令來(lái)啟動(dòng)我們的博客。
hexo g //利用Hexo 生成靜態(tài)頁(yè)面
hexo s //啟動(dòng)本地服務(wù)
你一定迫不及待想看看這個(gè)東西給你帶來(lái)了什么樣的驚喜癣漆。打開(kāi)瀏覽器维咸，http://localhost:4000，你就可以看到一個(gè)模版博客已經(jīng)出現(xiàn)在你面前了惠爽，雖然這不是你最終想要的癌蓖，不過(guò)也算是讓我們眼前一亮。
命令倒是執(zhí)行了幾個(gè)了婚肆，但是我們不知道它到底做了些什么租副。先來(lái)看看吧。
ls //查看文件目錄较性， 當(dāng)然一些隱藏文件無(wú)法查看用僧， 沒(méi)關(guān)系，ls -al即可赞咙。
暫時(shí)忽略其他文件是干什么的责循，先看看 _config.yml，這是我博客的設(shè)置攀操。
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
# Site
title: Shawenlx #博客標(biāo)題
subtitle: #副標(biāo)題
description: I love code and share. #個(gè)人描述
author: Liuxi #作者名
language: en #站點(diǎn)語(yǔ)言院仿，如果是中文，把en替換成zh-CN
timezone: #同步時(shí)區(qū)
# URL
url: /
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:
# Directory 文件目錄對(duì)應(yīng)生成的文件夾目錄
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:
# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight: #代碼高亮
enable: true
line_number: true
auto_detect: false
tab_replace:
# Category & Tag
default_category: uncategorized
category_map: categories
tag_map:
# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
# Pagination
## Set per_page to 0 to disable pagination 設(shè)置分頁(yè)
per_page: 10
pagination_dir: page
# Extensions
theme: next #主題模版速和，搜索 ./themes 文件夾下的主題意蛀，此處我用的NexT模版
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: https://github.com/shawenlx/shawenlx.github.io.git
branch: master
Tips: 當(dāng)我們著手修改這個(gè)文件的時(shí)候耸别，字段名以及:后面，切記一定要加一個(gè)空格县钥！我一開(kāi)始也遇到這個(gè)問(wèn)題秀姐，執(zhí)行hexo g命令的時(shí)候，就會(huì)報(bào)錯(cuò)提示我_config.yml文件無(wú)法解析若贮。
將博客托管到Github平臺(tái)
- 創(chuàng)建一個(gè)GitHub倉(cāng)庫(kù)省有，
new repository - 在 Repository name 欄中，輸入
your user name.github.io谴麦，譬如我的GitHub用戶名是shawenlx蠢沿，所以就建立工程名為：shawenlx.github.io - 配置好本地的SSH Key。
- 擁有了個(gè)人的GitHub Pages后匾效，再回到Hexo的
_config.yml文件, 參照我的配置保存即可舷蟀。
deploy:
type: git
repo: https://github.com/shawenlx/shawenlx.github.io.git
branch: master
- 最后利用hexo命令，將博客推送到Github上面哼。
hexo clean #推送前野宜，先清除下本地?cái)?shù)據(jù)庫(kù)，防止緩存導(dǎo)致上傳不成功
hexo d -g #利用這個(gè)組合命令魔策，將博客上傳到github上匈子。
- 當(dāng)你打開(kāi)瀏覽器，輸入
your_user_name.github.io闯袒，就可以看到你托管到平臺(tái)上的數(shù)據(jù)了虎敦。
關(guān)于博客主題模版
- 網(wǎng)上有各種各樣的模版，我用的NexT, 參照官方文檔進(jìn)行配置就可以了政敢。目前博客還在完善其徙，特此記錄本博客的搭建經(jīng)歷。
關(guān)于管理博客內(nèi)容
- 參照Hexo官方文檔
最后
以后簡(jiǎn)書(shū)會(huì)同步更新這個(gè)博客的內(nèi)容喷户。
復(fù)習(xí)本博客鏈接：shawenlx.cn
