基于Github搭建Hexo个人博客

一、准备工作

  • Github账号
  • nodejs
  • npm
  • git for windows

二、创建github仓库

  • 创建以你的用户名.github.io的仓库

三、域名绑定(可选)

四、配置SSH key

为什么要配置这个呢?因为你提交代码肯定要拥有你的github权限才可以,但是直接使用用户名和密码太不安全了,所以我们使用ssh key来解决本地和服务器的连接问题。

  • 用git bash执行如下命令,如果提示:No such file or directory 说明你是第一次使用git
    $ cd ~/. ssh #检查本机已存在的ssh密钥

  • 然后连续3次回车,最终会生成一个文件在用户目录下,打开用户目录,找到.ssh\id_rsa.pub文件,记事本打开并复制里面的内容,打开你的github主页,进入个人设置 -> SSH and GPG keys -> New SSH key;将刚复制的内容粘贴到key那里,title随便填,保存。
    ssh-keygen -t rsa -C "邮件地址"

  • 测试SSH-Key是否设置成功

1
2
3
4
5
 ssh -T git@github.com # 注意邮箱地址不用改

# 如果提示Are you sure you want to continue connecting (yes/no)?,输入yes,然后会看到:
# Hi 【用户名】! You’ve successfully authenticated, but GitHub does not provide shell access.
# 看到这个信息说明SSH已配置成功!
  • 配置全局用户名和邮箱
1
2
$ git config --global user.name "用户名" # 你的github用户名,非昵称
$ git config --global user.email "邮箱" # 填写你的github注册邮箱

五、Hexo部分

  • 安装Hexo

npm install -g hexo

  • 初始化Hexo
1
2
cd /d/workspaces/hexo/ # 工作目录
hexo init
  • 部署、启动服务
1
2
hexo g # 生成
hexo s # 启动服务
  • 本地预览问题
1
hexo s是开启本地预览服务,打开浏览器访问 http://localhost:4000 即可看到内容,很多人会碰到浏览器一直在转圈但是就是加载不出来的问题,一般情况下是因为端口占用的缘故

六、修改Hexo主题

  • 官网主题
    https://hexo.io/themes/

  • 新推荐极简主题
    https://github.com/aircloud/hexo-theme-aircloud

  • 更换主题(以yilia为例)

    1
    2
    3
    4
    5
    https://github.com/litten/hexo-theme-yilia

    - 进入目录下载主题
    cd /d/workspaces/hexo/
    git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
  • 修改配置文件

1
2
修改_config.yml中的theme: landscape改为theme: yilia,然后重新执行hexo g来重新生成。
如果出现一些莫名其妙的问题,可以先执行hexo clean来清理一下public的内容,然后再来重新生成和发布。

七、上传到github

  • 修改配置文件
1
2
3
4
5
6
...
deploy:
type: git
repository: git@github.com:用户名/用户名.github.io.git
branch: master
...
  • 安装插件
1
2
# 部署前还需要安装插件,git bash执行
npm install hexo-deployer-git --save
  • 提交至Github
1
2
# 如果一切正常,可以执行hexo d将代码上传至github,之后就可以打开https://用户名.github.io/浏览你的个人博客了
hexo d

八、常用hexo命令

  • 常见命令
1
2
3
4
5
6
7
hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)
hexo deploy #部署到GitHub
hexo help # 查看帮助
hexo version #查看Hexo的版本
  • 缩写
1
2
3
4
hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy
  • 组合命令
1
2
hexo s -g #生成并本地预览
hexo d -g #生成并上传

九、写博客

  • 写博客

    1
    2
    # 定位到hexo目录,执行下面语句,hexo会帮我们在_posts下生成相关md文件,我们只需要打开这个文件就可以开始写博客了
    hexo new 'my-first-blog'
  • 一般完整格式如下

1
2
3
4
5
6
7
8
9
---
title: postName #文章页面上的显示名称,一般是中文
date: 2013-12-02 15:30:16 #文章生成时间,一般不改,当然也可以任意修改
categories: 默认分类 #分类
tags: [tag1,tag2,tag3] #文章标签,可空,多标签请用格式,注意:后面有个空格
description: 附加一段文章摘要,字数最好在140字以内,会出现在meta的description里面
---

以下是正文