Hexo + Github 搭建个人博客

发表于 更新于 分类于 阅读次数：

按照以下步骤，你可以搭建一个与本站点同样简洁漂亮的个人博客，完全自由免费。

前提条件：

  • 熟悉 git + Github
  • 熟悉 Nodejs
  • 写博客当然还少不了 Markdown 基础

创建 Github 仓库

在 Github 中创建一个仓库，名为 xxx.github.io

注：xxx 必须是你自己的 Github 用户名，否则博客网站将无法打开。例如，我的仓库命名为 hzhu212.github.io

安装 Hexo

要求已安装 Nodejs

1
npm install -g hexo-cli

考虑到网络问题，可能需要几分钟的时间。
如果由于网络问题无法安装，你可能需要使用 cnpm 或 nrm

创建 blog 项目

命令行定位到需要存放博客的目录，以下以 Windows 平台为例：

1
cd /d C:\users\xxx

执行以下命令：

1
hexo init blog

将在 C:\users\xxx 目录下 新建 一个子目录 blog，作为博客项目的根目录。

接下来需要安装依赖库：

1
2
cd blog
npm install

本地调试与发布

连续执行以下 2 条命令：

1
2
hexo g
hexo s

当命令运行完成后，打开浏览器访问 http://localhost:4000/。

Boom！~

你的博客站点新鲜出炉了~，还附带了第一篇 Hello World 博客。

注：上面的 2 条命令其实是简写：
hexo g = hexo generate，生成静态文件
hexo s = hexo server，开启站点服务器

开始写作吧

ctrl+c 退出 hexo server，然后执行：

1
hexo n "my first blog"

将创建一篇新的博客，标题为 【my first blog】

注：每篇博客都是一个 Markdown 文件，默认放在 /blog/source/_posts/ 目录下，可直接编辑

再次执行

1
hexo s

访问 http://localhost:4000/，你的第一篇博客大功告成了！

注：hexo server 支持热更新，编辑完 Markdown 文件后，只需刷新页面就能立即更新博客

发布网站

目前的你的博客网站还只支持本地访问，为了让 13 亿人都能够欣赏你的大作，你需要把它推送到 Github 上。

hexo 发布网站非常简单，只需要一条命令：

1
hexo d

但万事总有个 BUT，在此之前，你还需要一些准备工作：

安装 Github 部署插件

1
npm install --save hexo-deployer-git

告诉 hexo 你要把网站部署到何处

进入 /blog 目录，找到 _config.yml 文件，这是博客项目的全局配置文件。打开它并翻到末尾，看到 deploy 选项，我们把它修改为：

1
2
3
4
deploy:
  type: git
  repo: git@github.com:xxx/xxx.github.io.git # 这里改成你第一步创建的 git 仓库地址
  branch: master

保存配置文件。然后依次执行以下 3 条命令：

1
2
3
hexo clean
hexo g
hexo d

注：hexo d = hexo deploy，部署

Bingo~

你的个人博客网站 https://xxx.github.io 建成了，不费吹灰之力！

悄悄夹带上我的私货：hzhu212.github.io

美化你的博客网站

网站是建成了，然而现在的你并没有一丝喜悦，我知道你一定是被 Hexo 的默认主题美哭了！
不过别失望，Hexo 为我们提供了 海量的主题库

选择一款自我感觉良好的主题，在介绍页面上找到它的 Github 仓库地址，然后把它下载下来。以 Anisina 主题为例：

1
git clone https://github.com/Haojen/hexo-theme-Anisina themes/Anisina

再次打开全局配置文件 blog/_config.yml，翻到末尾，找到 theme 配置项，将其修改为：

1
theme: Anisina

重新部署，你的网站焕然一新了！

注：有些主题会内置多种 样式（scheme），例如我使用的 next主题，定制性更强。
用户可进入 /blog/themes/next/ 目录，打开主题配置文件 _config.yml ，在其中的 scheme 字段下选择一种样式。

关于 Hexo 更多信息请访问 Hexo 官网