Mac上基于hexo+GitHub搭建个人博客(一)

之前一直使用博客园和简书,但是博客园太复杂,而简书虽然很简单,但是没什么新鲜感,偶然得知hexo+github可以搭建自己的博客,主要是可以自己定主题,还很simple,因此,找了个时间,自己搞了一下,感觉还可以,就自己弄了一个。

环境配置

Hexo官网上有搭建文档!

安装Node.js

Node.js是一个Javascript运行环境,用来生成静态界面,到Node.js官网上下载相应的版本即可,我搭建时v8.11.1 LTS,傻瓜式一路安装!

Git

mac系统自带Git

安装Hexo

安装Hexo

当前两步准备好了之后,就可以使用命令安装了,打开终端输入命令:

1
$ sudo npm install -g hexo

这个地方一开始出现rollbackFailedOptional,好像是什么Failed,正当我去百度的时候,再回头,居然在开始安装了,懵逼!

本地初始化操作

cd 到你想安装的目录,比如我选的Documents下,执行hexo init命令

1
$ hexo init iblog

iblog 是我建立的文件夹名称,cd到iblog文件夹下,执行安装npm 命令:

1
$ npm install

开启hexo服务器:

1
$ hexo s

此时终端出现
本地启动
指示我们的服务器已经开始跑起来了,在浏览器中输入网址:http://localhost:4000/即可看到如下界面
本地打开后的页面
此时说明本地已经设置好了!,接下来开始关联GitHub。

关联Github

首先New repository 以下,创建一个新的仓库,注意仓库名称为固定写法用户名.github.io,比如我的为Numen-fan.github.io,如下图所示:
新建仓库
创建完成后为:
image
同时本地iblog文件夹下有如下内容:
image

cd到iblog下面,vim打开_config.yml文件,

1
$ vim _config.yml

打开后翻倒最后面修改为如下样式(我是用submit打开的):

1
2
3
4
deploy:
type: git
repository: https://github.com/Numen-fan/Numen-fan.github.io.git
branch: master

注意这里的链接是创建仓库时生成的,为了手写错误,最好从创建出copy过来

同时注意这里的:后一定需要空格(切记)

iblog下执行如下命令,用来生成静态的页面

1
$ hexo g

网上说这里可能报错

ERROR Local hexo not found in ~/blog
ERROR Try runing: ‘npm install hexo –save’

我似乎没有,蛮幸运。

解决办法是

1
2
$ npm install hexo --save
>

然后再开始配置,执行以下命令

1
$ hexo d

这个地方我报错了,提示无法链接到gi或找不到git,解决办法是需要安装hexo-deployer-git

1
$ npm install hexo-deployer-git --save

这个时候弹出:
密码验证

这个地方需要输入的是电脑的登录密码,我一开始以为是Github的账号密码了(懵逼)

可以选拒绝,随后需要输入以下两项:

1
2
Username for GitHub:
Password for GitHub:

后面配置了SSH之后,就可以不用每次输入了;

然后再次执行hexo ghexo d

执行成功后,浏览器输入https://Numen-fan.github.io(将Numen-fan改为自己的Github用户名即可),此时就能看到刚才和本地`http://localhost:4000`一样的界面了

注意这里如果你没有做SSH key的关联,在hexo d 时是需要你输入github的用户名和密码的。我之前做了关联,所有没有提示,每次都需要输入密码很烦,所以请参考配置SSH Key到GitHub

此致,敬礼

~~客官随意,我只是学习怎么配置打赏而已~~