1、说在前面的话
此博客主要记录本人在探索Hexo + GitHub搭建个人博客的过程,一方面给自己做备忘,一方面给初来者一些参考。最终的效果请参看我的博客:蓝亭书序的博客 。
本博客主要分为三部分,第一部分:简单的搭个helloworld到github上,最后能正常访问即可;第二部分:介绍常用的hexo配置信息以及更换一个第三方主题以及如何添加新博客等;第三部分:记录遇到的一些坑及其解决方案。
github提供了一项服务——github pages,此项服务能将自己的github某个指定的仓库作为自己的web容器,里面的所有html都可以通过一个指定的网址访问到,本博客主要利用这个特点去搭建一个自己的博客,但是写静态网页始终令人头疼,一方面要维护博客目录,一方面要写HTML代码,为了我们编写博客方便,于是乎引入了Hexo,他能帮我们优雅的管理博客及自动帮我们生成HTML,我们只需要简单的编写Markdown即可。Hexo官方中文文档网站为:Hexo官方中文文档
2、环境要求
在使用Hexo之前,我们需要安装几个必要的软件,分别是:Node.js、Git。安装过程很简单,这里不赘述。Node.js下载地址:Node.js官网下载,Git For Windows下载地址:Git。下载并安装好后,我们打开 CMD
命令行工具,分别输入 git --version
和 node -v
如果最终都有输出版本号信息,表示安装成功,如果没安装成功,请检查环境变量是否成功配置,例如我的结果如下(你们的也有可能和我版本不一样,这不是那么重要)。

另外,我们还需要注册一个Github账号,注册地址为:https://github.com/ 这里也不多说。
3、安装Hexo
安装成功后,我们打开 CMD
命令终端,执行命令 npm install -g hexo-cli
开始安装,等待一段时间安装完成后,我们执行命令 hexo version
如果没有提示 “不是内部或外部命令,也不是可运行的程序” 这样的错误,基本上是安装成功了,我的执行结果截图如下:

4、使用Hexo初始化一个新项目
找到一个合适的盘符,创建一个文件夹,用于放置Hexo项目,例如我在F盘创建一个Hexo文件夹,我们进入此文件夹并右键选择“Git bash here”,示意图如下:

紧接着我们会打开一个gitbash窗口【之后我们会多次打开这样的窗口,后文我会直接说“我们在xxxx文件夹下打开gitbash窗口,也就是这样的操作”】窗口示例如下:

在创建的gitbash窗口中执行命令 hexo init MyBlog
其中MyBlog是项目名,可以自定义。等待一段时间后,创建完毕,我们会看到文件夹下会创建出一个MyBlog文件夹,MyBlog文件夹目录结构如下【其中,_config.yml 是主要的配置文件,我们会在第二部分去讲解如何配置,scaffolds 是模板文件夹,source是资源文件夹是存放用户资源的地方,themes是存放主题的地方,第三方主题也会放在这里,第二部分我们会说】。

创建完成后,我们接着执行先执行命令 cd MyBlog
进入到我们创建的项目文件夹下(MyBlog是我执行命令“ hexo init MyBlog ”时使用的项目名) ,紧接着命令 npm install
,执行结果大致如下:

5、构建文件(生成HTML)
完成4的工作后,在我们的gitbash窗口中执行命令 hexo g
开始构建html文件(这个过程主要是将markdown渲染成HTML。你可以理解为“编译”,以后每当我们写了新文章,或者文章有改动,我们都需要执行此命令用于重新“编译”),我的截图如下:

6、启动本地服务器,测试结果。
完成5的工作后,接着在我们的gitbash窗口中执行命令 hexo s
启动本地服务器,用于预览我们的效果。执行了命令后,我的截图如下:

此结果提示我们,本地服务器启动完毕,我们可以通过在浏览器输入 “http://localhost:4000/ ” 用于查看我们的结果。当我们打开浏览器,输入“http://localhost:4000/ ” 后,就可以看到我们的初始网页啦(默认情况下,Hexo会给我们生成一张Hello World的博文),效果如下:

到此,我们的本地博客大致已经搭好了,下面准备部署到github上
7、在GitHub上开放GitHub Pages功能
我们登录到GitHub个人中心,创建一个新的仓库,操作示意图如下:

紧接着填入仓库信息并创建仓库

创建好仓库后,我们进入仓库的设置界面。

滑动到仓库设置界面的最底部,找到“GitHub Pages”选项,点击“Choose a theme”。

然后自己随便选个主题即可,这个并不重要,随便选即可(和我们第二部分要讲的是两码事)。

8、生成本地公钥和私钥
回到我们的gitbash命令窗口,执行命令 ssh-keygen
,准备生成本地公私钥,在执行此命令时,终端会提示我们输入一系列的参数,这里做个简单介绍:
1 |
|
我的截图如下:

执行完毕后,会在 “ c://Users/用户名/.ssh 文件夹下 ”生成两个文件(其他文件不用管),分别是: id_rsa 和 id_rsa.pub。

用记事本打开 id_rsa.pub 文件,复制里面的所有内容。打开GitHub,进入设置,再进入 SSH and GPG keys页面。

点击 NEW SSH key 进入SSH key添加界面。其中:title任意填,key填入刚刚我们复制的id_rsa.pub的内容,最后点击 Add SSH key 完成添加。

9、修改本地配置,用于向GitHub提交博客
进入我们的项目文件夹(我的是MyBlog),找到 “ _config.yml ” 配置文件,使用记事本打开,滑到最后,找到“ deploy: ”修改代码如下(其中repo:后面的lantingshuxu为我的GitHub用户名,这里应该填写成自己的):
需要注意的是【type: 或者repo:或者branch:这些冒号后面必须要有一个空格!!!】
1 | deploy: |
10、最后一步:提交
回到我们的gitbash命令终端,执行命令 hexo d -g
部署我们的博客,此过程中可能会叫我们输入一次密码,这个密码是我们第8步生成公私钥的时候设置的密码,如果没有设置应该不会提示,提示的话,直接回车即可。
稍等片刻,我们访问网址:https://你的GitHub用户名.github.io 就可以看到我们的网址啦!
如果遇到什么问题,请在下方评论留言哦~
第一部分完毕,后事如何,请看第二部分:【使用Hexo和GitHub搭建个人博客-2】