基于Hexo和Github搭建博客

前言

这是一篇使用GitHub Pages和Hexo搭建独立博客的总结

在看之前，应该先了解一下：

准备工作

创建对应仓库

  1. 安装Git，略
  2. 注册GitHub，略
  3. 配置Git，略
  4. 与GitHub建立联系，略
  5. 以上4步相关资料：Git和Github简单配置
  6. 在GitHub上创建新的仓库，命名为 username.github.io (其中username为github的用户名)，例如 Ryokai96.github.io

安装Hexo

  1. 安装Hexo需要首先安装Node.js，到官网下载安装(最好安装LTS版本)：Node.js官网

  2. 新建本地文件夹blog

    $ mkdir blog
$ cd blog

  3. 全局安装hexo-cli，blog文件夹内安装hexo

    $ npm install -g hexo-cli
$ npm install hexo

搭建Hexo博客

  1. 创建并初始化Hexo目录

    $ hexo init Hexo

    完成后，当前目录下会多出一个Hexo目录

  2. 在Hexo目录中安装需要的插件

    $ cd Hexo
# hexo deploy git插件
$ npm install hexo-deployer-git --save

  3. 测试

    # 新建hellohexo.md文章
$ hexo new hellohexo.md
# 渲染成静态页面
$ hexo generate
# 启动本地hexo服务器
$ hexo server

    上面两条也可简写为

    $ hexo g
$ hexo s

    然后在浏览器中输入localhost:4000即可进行预览

  4. 使用GitHub Pages搭建一个Hexo博客

    编辑Hexo目录下的_config.yml文件

    $ vim _config.yml

    将下面这段进行修改

    # Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type:

    修改为

    # Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repository: git@github.com:Ryokai96/Ryokai96.github.io
  branch: master

    注意 : 后面有一个空格，如 type: git

    repository后的url使用ssh形式，注意最后的.git要去掉

  5. Hexo首页默认显示最新的一篇文章，可以在文章中使用<!--more-->来分割预览的文章和更多详情，或者使用hexo-excerpt插件来自动分隔（不推荐）。若要使用hexo-exerpt，首先在Hexo目录下安装插件：

    # hexo 自动截断插件
$ npm install hexo-excerpt --save

    然后编辑Hexo目录下的_config.yml文件，添加以下配置：

    excerpt:
  depth: 2
  excerpt_excludes: []
  more_excludes: []
  hideWholePostExcerpts: true

  6. 完成部署

    $ hexo generate
$ hexo deploy

    这两条也可简写为

    $ hexo g
$ hexo d

    之后，在浏览器中键入 Ryokai96.github.io 即可访问博客

Hexo的同步

使用Hexo搭建博客的同学可能会遇到这个问题：如果更换了设备，如何对Hexo博客进行管理？

github或者gitee都有免费的私有仓库，使用私有仓库同步hexo代码，即可多设备同步hexo配置。

  1. 在github或gitee新建一个仓库，名字随便，比如blogcode

  2. 在blog目录下初始化git仓库

    $ git init

  3. 修改.git文件夹下的config文件

    $ cd .git
$ vim config

    修改config文件，添加以下配置，指定远程仓库

    [remote "origin"]
        url = git@github.com:Ryokai96/blogcode.git
        fetch = +refs/heads/*:refs/remotes/origin/*
[branch "master"]
        remote = origin
        merge = refs/heads/master

  4. 如果在新建远程仓库的时候生成了README文件，可以先git pull一下

  5. 推送

    $ git add .
$ git commit -m "hexo init"
$ git push origin master

    注意：如果有包含的目录是其他的git仓库，比如git clone方式安装的next主题，在themes/next目录下有.git目录，是无法同步next目录的，这里也不能将其作为子仓库，解决方式有两种，一种是直接删除next目录下的.git目录，另外一种是将next目录下的.git目录以及.git目录中的HEAD文件改名，比如改成.git_backup和HEAD_backup。使用第二种改名的方式可以在当该git仓库有更新时将名字改回来，用git pull更新，这种方式是否有弊端，我还不清楚。

  6. 之后要更新博客，进入Hexo文件夹，hexo g & hexo d，要同步源文件，就在blog根目录提交修改

  7. 更换设备后或重装系统后，想管理博客，通过如下步骤：

    1. git clone git@github.com:Ryokai96/blogcode.git

    2. 在克隆过来的本地仓库ryoukai中执行以下指令

      $ npm install
$ cd Hexo
$ npm install

      然后就可以像原来一样管理博客了

Hexo其他配置

posted @ 2020-09-03 14:42  Ryokai  阅读(341)  评论(0)    收藏  举报