在macOS平台搭建基于Github Page的Hexo博客

以下内容基于网络搬运及个人踩坑总结

环境配置

  1. 前端工具Node.js - 用于生成静态页面

    1
    $ brew install nod

    没有homebrew的话在Terminal键入：

    1
    $ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/in stall)"

  2. 前端工具npm - Node Package Manager

    1
    $ npm install

  3. Git
    在Mac Store安装Xcode自带Git工具

    otherwise, visit https://git-scm.com/download

  4. Hexo - 博客框架，一键生成静态页

    1
    $ sudo npm install -g hexo

初始化

  1. 建立hexo目录，执行hero init命令：

  2. $ hexo init <folder>

    1
    2
    3
    4
    5

    hexo将自动下载框架至`folder`。

    初始化后`folder`中内容：

    
_config.yml    
db.json 
node_modules 
package.json
scaffolds
source
themes

    1
    2
    3

    1. 开启hexo服务器：

    
$ hexo server

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15

       浏览器中打开网址[http://localhost:4000](http://0.0.0.0:4000/)，能看到hexo的hello world，则本地环境搭建成功。

       [![img](https://s2.ax1x.com/2019/05/12/E4nX6S.jpg)](https://s2.ax1x.com/2019/05/12/E4nX6S.jpg)

    ## 关联Github

    1. 创建新的Github Repository作为github page的仓库：

       命名规则为：自定义.github.io

       [![img](https://s2.ax1x.com/2019/05/12/E4njOg.jpg)](https://s2.ax1x.com/2019/05/12/E4njOg.jpg)

    2. 打开`folder`中`_config.yml` 编辑最后一行:

    
deploy:
  type: git
  repo: https://github.com/user_name/自定义.github.io.git
  branch: master

    1
    2
    3

    1. 用hexo生成静态页：

    
$ hexo generate

    1
    2
    3

    2. 部署网页：

    
$ hexo deploy

    1
    2
    3

    若deploy出错，可能是未安装hexo deployer git

    
$ npm install hexo-deployer-git --save

    1
    2
    3

    deploy成功会显示：

    
INFO  Deploy done: git

    1
    2
    3

    1. 首次运行要输入github账户密码：

    
Username for 'https://github.com':
Password for 'https://github.com':

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11

    2. deploy执行后会将`folder`文件同步至Git Repo，根据网络状况可能上传失败，建议打开vpn。

       上传成功后打开`https://自定义.github.io`即可看到和打开`https://localhost:400`一样的Hello World。

    ## 安装hexo主题

    1. **[hexo官网主题页](https://hexo.io/themes/)** 有大量第三方主题。下面以**cactus**为例。

    2. 在`folder`目录下执行：

    
$ git clone https://github.com/probberechts/hexo-theme-cactus.git themes/cactus

    1
    2
    3
    4
    5

       即可将主题下载到`themes`目录下`cactus`文件夹。

    3. 修改`folder`中`_config.yml`：

    
# theme: landscape
theme: cactus

  3. 保存_config.yml后重新执行hexo generate及hexo deploy即可将新主题的静态页部署在git上。