0%

安装Hexo并部署到Github Page

本文将介绍在Windows 7的环境下创建一个使用Next主题的Hexo博客,并通过SSH免密码的方式部署到Github Page上。本文还会涉及自定义域名和实现HTTPS访问。本文不会涵盖Node.js, Hexo, 以及GitHub的具体介绍。

本地搭建Hexo博客

安装Hexo

  1. 下载并安装Node.js (推荐LTS版)。

  2. 打开cmd命令窗口,输入命令安装Hexo:

    1
    $ npm install -g hexo-cli
  3. 在目标文件夹新建一个博客

    1
    2
    3
    $ hexo init <folder>
    $ cd <folder>
    $ npm install

    也可以自行新建一个文件夹,然后再文件夹下运行hexo init 来初始化博客。

  4. 运行命令hexo s启动Hexo服务器,用浏览器访问http://localhost:4000, 检查博客是否运行。

安装Next主题

  1. 到Next on Github页面下载Next主题的zip压缩包,解压缩到themes文件夹下,把文件名修改为next。
  2. 在博客文件夹根目录下的_config.yml文件里,找到 theme 字段, 并将其值改为next。
  3. 关闭(ctl + c),清理(hexo clean),并重启(hexo s)Hexo服务器, 用浏览器访问http://localhost:4000, 检查主题是否成功运行。

每次修改完网站或主题的配置,都需要清理并重启Hexo服务器后,才能看出修改后的效果。

使用Data File自定义网站

Next主题推荐使用Data File而不是主题配置文件/themes/next/_config.yml来自定义网站。好处是,当升级Next主题时,不会覆盖掉之前的配置。

  1. 确认使用的是Hexo 3以上版本。
  2. 在<folder>/source/_data文件夹下新建文件next.yml。
  3. 从网站配置文件/_config.yml或者主题配置文件/themes/next/_config.yml复制需要修改的选项,添加到文件next.yml中,并修改相应的值。
  4. 重启网站查看效果。

标签(Tags)页面

  1. 在网站根目录下运行命令创建tags页面

    1
    hexo new page tags
  2. 在新创建的页面文件中,把type的值改为tags。 如果网站开启了评论功能,但是想关闭该网页的评论功能,加入属性comments, 值设为false。

    1
    2
    3
    4
    5
    title: Tags
    date: 2014-12-22 12:39:04
    type: "tags"
    comments: false
    ---
  3. 修改配置文件中的menu选项,显示Tags链接

  4. 重启网站查看效果。

分类(Categories)页面

  1. 在你网站根目录下运行命令创建categories页面

    1
    hexo new page categories
  2. 在新创建的页面文件中,把type改为categories。 如果网站开启了评论功能,但是想关闭该网页的评论功能,加入属性comments, 值设为false。

    1
    2
    3
    4
    5
    title: Categories
    date: 2014-12-22 12:39:04
    type: "categories"
    comments: false
    ---
  3. 修改配置文件中的menu选项,显示Categories链接

  4. 重启网站查看效果。

部署到GitHub Page

安装Git

下载并安装Git

创建版本库(Repository)

在GitHub创建一个名为”username.github.io”的版本库(username为GitHub用户名)。如果你是免费的基本账户,请设置类型为public。

生成SSH密钥

  1. 打开Git Bash。
  2. 可运行ls -al ~/.ssh来查看是否已经有SSH key。
  3. 如果已经有SSH Key,请参考文档Adding your SSH key to the ssh-agent 添加SSH Key到ssh-agent。添加前,请确认这个SSH Key的email是GitHub账号可接受的email。
  4. 如果没有SSH Key,使用ssh-keygen生成密钥。
    1
    2
    3
    4
    $ ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
    # Creates a new ssh key using the provided email
    Generating public/private rsa key pair.
    Enter a file in which to save the key (c:/Users/you/.ssh/id_rsa):
    使用默认的地址和文件名直接enter,接下来显示如下:
    1
    2
    > Enter passphrase (empty for no passphrase): [Type a passphrase]
    > Enter same passphrase again: [Type passphrase again]
    可点击Enter, 不设置密码。

密钥设置成功。

添加SSH公钥到GitHub

  1. 用记事本或其他文字编辑器打开文件c:/Users/you/.ssh/id_rsa.pub,复制所有内容。
  2. 登陆GitHub,在任一页面的右上角,点击你的profile photo, 然后点击Setting。
  3. 在左边栏里点击SSH and GPG keys。
  4. 点击 New SSH key 或 Add SSH key。
  5. 在Title栏里,填入文字描述用来识别公钥。
  6. 粘贴公钥的内容到Key栏里。
  7. 点击Add SSH Key。
  8. 最后输入GitHub密码确认添加公钥。

测试SSH连接

  1. 打开Git Bash。
  2. 运行ssh -T git@github.com。 在需要确认的时候输入yes。
  3. 如果成功的话,屏幕显示:
    1
    2
    > Hi username! You've successfully authenticated, but GitHub does not
    > provide shell access.

上传博客网站文件

  1. 安装 hexo-deployer-git

    1
    $ npm install hexo-deployer-git --save
  2. 编辑_config.yml

    1
    2
    3
    4
    5
    deploy:
    type: git
    repo: git@github.com:username/username.github.io.git
    branch: master
    message: "{{ now('YYYY-MM-DD HH:mm:ss')}}"

    如果repo的值为 https://github.com/username/username.github.io.git , 那么实际使用的是HTTPS来上传文件,每次上传都需要输入GitHub的用户名和密码。

  3. 运行hexo clean, hexo g来清理和重新生成静态页面。

  4. 运行hexo d上传页面文件。

  5. 用浏览器访问https://username.github.io,查看新上传的网站。

绑定域名

配置域名

在域名提供商用户后台

  • 添加4条A记录:
    @ A 185.199.108.153
    @ A 185.199.109.153
    @ A 185.199.110.153
    @ A 185.199.111.153
  • 添加1条CNAME记录:
    www CNAME username.github.io

配置GitHub

  1. 登陆GitHub,到博客的项目页面,点击Settings
  2. 在Custom domain 里填入你的域名,建议填入www.domainname.com。这样当用户访问domainname.com时,会转到www.domainname.com。
  3. 点击Save保存。

域名绑定需要2个小时到1天时间。

添加文件CNAME

在/source文件夹下新建一个文件名为CNAME的文件。文件内写入域名,例如www.domainname.com。

如果不这样做,每次运行hexo d的时候,都会删除GitHub上的CNAME文件,发生域名指向错误。添加这个文件后,当运行hexo g生成静态页面时,CNAME文件也会生成在网站根目录。

HTTPS访问

  1. 登陆GitHub,到博客的项目页面,点击Settings。
  2. 勾选Enforce HTTPS即可。

有时可能会因为域名服务器运行或者执照发布需要时间,导致Enforce HTTPS不能勾选。请在一天后重试,或者联系GitHub的支援小组。

上传源代码到GitHub

  1. 在GitHub上新建一个版本库(Repository)
  2. 打开Git Bash。
  3. 跳转到博客根目录下
    1
    $ cd ~\Documents\MyBlog
  4. 初始化git
    1
    $ git init
  5. 提交本地版本
    1
    2
    $ git add -A
    $ git commit
  6. 添加远端版本库
    1
    $ git remote add blog-src git@github.com:username/blog-src.git
  7. 下载远端项目,并建立远端指向
    1
    $ git pull blog-src
  8. 上传文件
    1
    $ git push blog-src master

因为Hexo已经建立了一个.gitignore文件,不需要版本控制的文档将不会上传。

参考文档