使用Hexo+Github Pages给自己搭建一个博客

前言

由于我专业原因,有大量软件都必须使用Windows,并且我的笔记本在安装Linux的过程中,总容易出现各种兼容问题,因此没有安装Windows/Linux双系统,而在Windows上使用虚拟机也不是一个太棒的选择,最后使用了win10的Linux子系统,体验感觉还行,如果在Windows平台安装失败的同学可以参照我博客的Linux部分尝试安装。

在windows上安装

准备安装的必要工具

本篇默认使用git bash作为bash环境,并且自带git,可以从这里下载安装,还需要安装node.js,可以从这里下载安装(记得勾选Add to PATH)。
我当前使用的node.js版本为v8.10.0,npm版本为5.6.0,版本不一致可能带来不可预知的错误

进行本地安装

  1. 首先使用npm安装hexo

    1
    $ npm install -g hexo-cli

    你可以使用hexo -v查看是否安装成功

  2. 创建的博客
    使用cd跳转到一个安全的目录,例如

    1
    $ cd ~/Documents

    初始化你的博客

    1
    $ hexo init myblog
    • 这条命令执行中经常出现各种问题,可以rm -rf myblog删除这个目录重试

    • 如果经常连接github失败,建议使用系统代理

    • 仍然无法正确安装并初始化?
      可以用Linux子系统试试,参照本篇Linux部分

  3. 验证

    1
    2
    $ cd myblog
    $ npm i

    博客初始化就完成了

    现在输入

1
$ hexo server
然后在浏览器中访问`http://localhost:4000/`即可预览界面。

界面是这样的
预览图像

使用Github Pages

在Github上新建一个名为你github用户名.github.io的新repo
在博客目录中打开配置文件

1
$ vim _config.yml

把最后一行type 改成type: git
在最后一行,与type平齐,加上repo: 仓库地址
比如的仓库地址是:git@github.com:Geylnu/Geylnu.github.io.git
安装git部署插件

1
npm install hexo-deployer-git --save

请在此前确认已经正确配置git
然后输入

1
$ hexo deploy

OK
等上几分钟,访问用户名.github.io就能看见自己的博客了。

  • 如果访问失败,检查Github Pages是否开启
  • 如果缺少样式,检查仓库名是否正确

添加新的博客命令:

1
hexo start "新的博客名"

重新生成页面使用

1
hexo g

使用Coding Pages服务

由于总所周知的原因,Github在国内的访问很不稳定,由Github Pages支撑的博客自然也难以访问,coding位于国内,并且也支持Pages服务。
使用coding时,只需要将仓库名命名为你的用户名.coding.me,就可以了,其他操作和Giihub pages相同。

在Linux(Ubuntu)上安装

我的系统环境

我使用的是win10 1709版本,os内部版本为16299.309,安装的Linux子系统为Ubuntu 16.04.3内核版本4.4.0-43-Microsoft
你可以参照这里安装win10 Linux子系统。

安装node.js

使用官方的脚本安装

1
2
$ curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
$ sudo apt-get install -y nodejs

如果你是其他Linux发行版本或想安装其他版本,你可点此访问相关说明

安装Hexo

使用npm安装hexo

1
$ sudo npm install -g hexo-cli

安装完成后可以使用node -vnpm -v确认是否安装成功

初始化博客

1
$ hexo init myblog

我在这一步总是遇见报错
报错
根据错误提示尝试了各种办法都没有解决(还害的我重新装了次子系统),之后我在Github也看见了有人遇见了同样的问题

因为这个问题是偶发性的,其实直接cd ./myblog重新执行npm install

还是报错?
报错
再来,直到不报错为止
成功
OK
可以用hexo s验证是否能正确浏览,其他的就很在windows一样了