Hexo + Github 博客搭建

发表于 分类于

Hexo是一个基于Node.js的静态博客框架，安装简单，搭建方便。由于Hexo生成的是一个静态的网站，因此可以搭建在一些提供静态网站服务的地方，例如Github。所以整体来说这个轻量型的博客可以基本满足我的需求，但缺点就是不能随时更新博客，考虑到我的博客的更新频率，这也不会是太大的问题。

搭建步骤

  • Github个人网站
  • 安装Node.js 和 Hexo
  • 建立博客
  • 发布文章

Github 个人网站

在Github上新建一个仓库，仓库的名称取：用户名.github.io，例如我的用户名是clarkwangbc，因此这个仓库的名称就是clarkwangbc.github.io

然后需要讲Github与我的电脑连接起来，关于这一点，可以参考README.md中建立Git和Github的连接部分。

当然，确保你的电脑上安装了Git

安装Node.js 和 Hexo

由于我的博客主要会在我的MacBook Pro上更新，因此以下的这些操作都是基于Mac的。

  1. 安装Node Version Manager (nvm)

    nvm 是一个开源的node.js多版本管理Bash工具，类似于Python中的pyenv工具，用于在Bash环境中随意切换已安装的node版本。目前nvm的版本是0.34.0，因此可以使用如下代码进行安装：

    1
    curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash

    或者是Wget

    1
    wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash

    具体可以参考官方指南。

  2. 安装Node.js

    使用nvm安装最新的Node.js

    1
    nvm install node

    nvm安装的可能不是Node官方推荐的稳定版本，因此建议参考官方推荐版本后安装：

    1
    nvm install 10.16.0

  3. 安装Hexo

    1
    npm install -g hexo-cli

建立博客

安装hexo后，我们就可以建立我们的博客了。

  1. 首先我们建立一个Blog的文件夹，然后在此文件夹内初始化我们的博客：

    1
    hexo init blog

  2. 然后我们可以简单看一下我们的博客，输入以下命令：

    1
    2
    hexo g
    hexo s

    然后我们用浏览器打开 localhost:4000就可以看到我们的博客了。

  3. 当然这样的博客可能太简陋了，我们可以选择一个我们喜欢的主题，例如Next。

    1
    git clone https://github.com/iissnan/hexo-theme-next themes/next

    打开博客的根目录中的_config.yml文件，修改主题为next，并修改deploy信息如下

    ：

    然后再打开themes/next/_config.yml文件，调整主题的各种参数，这里我把主题的风格改为Mist。

  4. 更换主题后，我们可以用如下命令来实时观看我们的修改效果：

    1
    hexo s --debug

  5. 在确认没有问题后，我们可以将博客推送到Github上。不过在此之前，我们得先安装一个部署到Github上的工具：

    1
    npm install hexo-deployer-git --save

    然后就可以部署了

    1
    hexo d

    有时候为了方便，我们会将生成和部署一起使用：

    1
    hexo g -d

    成功后便可以在自己的Github Page上浏览了。

发布文章

  1. 在命令行中输入

    1
    hexo n "article_name"

    在博客根目录下source/_post中多出了一个叫article_name.md的文件，使用markdown的编辑器打开就可以进行书写。

  2. 书写完成后，命令行中输入：

    1
    hexo g -d

    便可推送了