热衷学习,热衷生活!😄

沉淀、分享、成长,让自己和他人都能有所收获!😄

什么是Hexo?

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

安装Hexo前提

安装 Hexo 相当简单,只需要先安装下列应用程序即可:

  • Node.js (Node.js 版本需不低于 10.13,建议使用 Node.js 12.0 及以上版本)
  • Git

成功安装好Git,Node.js之后可以使用下面命令行查看版本。

1
2
git --version
node -v

安装Hexo

Git和Nodejs安装好后,就可以安装Hexo了,你可以先创建一个文件夹blog,然后cd到这个文件夹下(或者在这个文件夹下直接右键git bash打开)

输入以下命令安装Hexo

1
npm install -g hexo-cli

安装完成之后输入hexo -v查看一下版本

1
hexo -v

安装 Hexo 完成后,请执行下列命令,Hexo 将会在指定文件夹中新建所需要的文件。folder是自己建的文件夹,也可以建好文件夹然后右键git bash打开,输入hexo initnpm install

1
2
3
hexo init <folder>
cd <folder>
npm install

初始化完成之后,指定文件夹的目录如下:

1
2
3
4
5
6
7
8
.
├── _config.yml #配置文件
├── package.json #应用程序的信息
├── scaffolds #生成文件的一些模版
├── source #存放写的文章
| ├── _drafts
| └── _posts
└── themes #主题

输入以下命令,生成静态文件和启动Hexo服务,在浏览器输入localhost:4000就可以看到你生成的博客了,可以ctrl + c停止服务

1
2
hexo g
hexo server

到这里Hexo已经全部安装完毕,如果要访问自己的博客就是一直启动Hexo服务,而且是在本地这肯定是不行,所以接下来我们要白嫖GitHub。

创建GitHub个人仓库

首先,你先有一个Github账户,如果没有先注册,有了账号之后,创建一个和你用户名相同的仓库,后面加.github.io,只有这样,将来要部署到GitHub page的时候,才会被识别,也就是xxxx.github.io,其中xxx就是你注册GitHub的用户名。比如我创建的是qingtian-space.github.io)

生成SSH添加到GitHub

回到 git bash中,这里的yourname输入你的GitHub用户名,youremail输入你GitHub的邮箱。

1
2
git config --global user.name "yourname"
git config --global user.email "youremail"

创建SSH,一路回车

1
ssh-keygen -t rsa -C "[email protected]"

这个时候它会告诉你已经生成了.ssh的文件夹。在你的电脑中找到这个文件夹C:\Users\用户\.sshid_rsa文件。

然后在GitHub的setting中(点击头像的setting),找到SSH keys的设置选项,点击New SSH key 把你的id_rsa.pub里面的信息复制进去。

在gitbash中,输入下面命令查看是否成功

1
ssh -T [email protected]

Hexo部署到GitHub

这一步,我们就可以将hexo和GitHub关联起来,也就是将hexo生成的文章部署到GitHub上,打开站点配置文件 _config.yml,翻到最后,修改为YourgithubName就是你的GitHub账户,我这里是qingtian-space.github.io

1
2
3
4
deploy:
type: git
repo: https://github.com/qingtian-space/qingtian-space.github.io.git
branch: master

这个时候需要先安装deploy-git ,也就是部署的命令,这样你才能用命令部署到GitHub。

1
npm install hexo-deployer-git --save

然后输入以下命令,其中 hexo clean清除了你之前生成的东西,也可以不加。
hexo generate 顾名思义,生成静态文章,可以用 hexo g缩写
hexo deploy 部署文章,可以用hexo d缩写

注意deploy时可能要你输入username和password。

1
2
3
hexo clean
hexo generate
hexo deploy

成功之后,可以再浏览器输入http://qingtian-space.github.io就可以看到自己的博客啦!

设置个人域名

现在你的个人网站的地址是 yourname.github.io,如果觉得这个网址逼格不太够,这就需要你设置个人域名了。但是需要花钱。

注册一个阿里云账户,在阿里云上买一个域名,我买的是 qtspace.cn,各个后缀的价格不太一样,比如最广泛的.com就比较贵,看个人喜好咯。买好域名之后,添加解析其中,192.30.252.153 和 192.30.252.154 是GitHub的服务器地址。注意,解析线路选择默认

登录GitHub,进入之前创建的仓库,点击settings,打开GitHub Pages 设置Custom domain,输入你的域名qtspace.cn

然后在你的博客文件source中创建一个名为CNAME文件,不要后缀。写上你的域名。

设置完之后,最后再git bash输入:

1
2
3
hexo clean
hexo g
hexo d

打开你的浏览器,输入你自己的域名,就可以看到搭建的网站啦!

这一篇就是Hexo+GitHub搭建个人博客,并设置个人域名,下一篇Hexo的基本配置,更换主题等。