在网上查找资料的时候偶然看到有人提到用Hexo来写博客,界面非常简洁,而且支持 markdown 解析,瞬间打算在我个人的学术网站上加入这个blog页面。之前写博客都是在现成的博客网站上写的,比如 网易的 和 CSDN 这种还算比较大型的技术博客,无奈广告实在是太多了,后来转战 google 的 blog,但是它的编辑页面实在是难用,就放弃了。所以现在打算试试这个 Hexo。
Hexo 用官方的来说就是一个快速,简洁且高效的博客框架。我用了大概不到一天的时间,就从安装到部署搞定了,虽然过程很崎岖,掉了很多坑。。。但是总体还是觉得挺不错的,所以接下来我会大致叙述一下整个过程,希望能够让看到的朋友少掉坑。
先附上Hexo网址,也有中文的。个人觉得基本上按照网页上的指导,前面的步骤基本都是没问题的。由于我是一开始就打算在我个人网页中加入这个博客页面作为一个子页面,所以我是在 coding.net 而非 git 上面建库。另外操作系统是win10.
准备工作及环境
- 在 coding 上新建一个项目库,命名 “blog”,同时设置 Pages服务
- 在电脑上一个你觉得不错的位置新建一个文件夹,命名随意,这个名字没太大关系,我命名为”Hexo_blog”, 这文件夹是用来放所有跟你这个博客相关的东西的。
安装及配置
安装前提
- Node.js 安装:在官网下载好你电脑对应的版本之后,点安装包进行安装,在接近最后一步是,选择 “Add to PATH” 选项进行安装
- git 安装:略
安装 Hexo:
使用 npm 安装 Hexo:1
$ npm install -g hexo-cli
配置
新建框架
去到你刚刚创建的那个要放所有Hexo东西的文件夹下,执行以下命令:1
2$ hexo init
$ npm install这个命令就是告诉hexo这里要建一个框架,然后它就会生成整个框架所需要的材料。
新建完成后,可以看见有很多的文件夹,具体每个文件夹啥作用请看官网。这里面有一个叫 _config.yml 的东西,非常重要,是你整个博客配置的基础。基本配置(只列出可能有坑的地方):
1
2
3language: zh-Hans
url: http://yoursite.com/blog
root: /blog/前面说了我是打算我个人网站子页面下加入这个blog,所以那个url, 对我来说是后面加上这个子目录名字,然后root那个地方也需要改成,如果你本身是一个网页来的(比如git的页面),那就不用设置这个root了。其他的配置具体可参见网页。最后关于主题(theme)和部署(deploy)的,接下来讲。
主题(theme)的确定
主题顾名思义就是你的博客的风格,Hexo有很多模板可供选择,要使用哪个模板,就需要将该主题拷贝到themes文件夹下,然后在_config.yml 更改主题的名字。我用的是 yilia 的主题,下面以此为例写步骤:
进入你放创建的hexo文件夹(e.g. Hexo_blog)下, 使用如下命令安装:
1
$ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
这需要你先找到该主题的github,也可以直接下载然后解压到你的themes文件夹下
- 进入Hexo_blog 下面那个 _config.yml, 修改 ‘themes: yilia’
- 进入Hexo_blog/themes/yilia, 里面也有一个 _config.yml, 在上面更改你想命名的主页的menu和其他的基本个人设置
开写你的第一篇博客
这个很简单,直接执行:
1
$ hexo new my-first-post
那个 my-first-post 是你的文章题目。所有的文章都会被放在 /source/posts 文件夹下。在这个文件夹下你可以看到一个 my-first-post.md 的文件。打开这个文件然后就在下面用markdown的语法就写好了。
在本地查看并生成静态网页
由于有文件的改动,所以需要先生成静态文件:
1
$ hexo g
生成之后可以hexo server来查看新建的文章或者网站:
1
$ hexo s
然后就能看到说在 http://localhost:4000 下可以打开。如果一切都没问题,那么就可以部署到真的网页上面了。
部署 (这部分很让我头疼)
先说步骤:
1.git-SSH 配置:
- 查看你的git user.email: 'git config user.email'
- 假如得到的email是 xx@gamil.com, 生成这个email对应的密匙: 'ssh-keygen -t rsa -C "xx@gmail.com"'
- 接下来会让你enter file to save the key,enter passphrase, enter passphrase again, 可以不需要设置这些秘密啥的,所以每一个问题出现,都按enter, 即连续3个回车。
- 然后会得到两个文件 'id_rsa' 和 'id_tsa.pub'
- 复制刚刚生成的密匙(其中xx/xx是你密匙生成的位置,在上一步骤中会显示): 'clip < xx/xx/id_rsa.pub'
- 在准备步骤中新建的那个库下,打开设置-添加公匙,将刚刚复制的内容粘贴到上面,至此,配置完成。
- 检查是否真的完成:输入'ssh -T xx@gmail.com',然后选择 'yes', 接着看到 Hi XX, You've successfully authenticated 等等,就表明已经设置成功了
2._config.yml 文件deploy的更改:
应该是在最下面,有个deploy,在下面写上你的库的ssh地址等如下:
1
2
3
4
5
deploy:
type: git
repo: git@git.coding.net:XX/blog.git
branch: master
message: update my blog.
3.部署:
先下载deployer: ‘npm install hexo-deployer-git –save’
然后执行:
1 | $ hexo d |
然后就可以看你的网页有没有变化了。
由于我是打算直接在我的个人网站下直接建一个子网页,所以一开始一直想的是deploy到我之前的那个库里面,我以为是直接添加到那个git repo 里面就好,没想到一deploy之后,发现之前的内容全没有了,然后才意识到应该是force push上去的,没有pull等过程,所以直接啥都没有了,没办法我又只好force push 我之前的网站内容上去,才将原网页复原。由于我不知道怎么可以只deploy到一个子folder里面去,所以我又新建了一个库叫blog,也就是文章开头写的那样。然后将这个库的地址作为deploy的git 地址,才可以。我发现coding上可以直接设置子静态页面,所以我也直接就将这个网页的地址链接到我原个人网站上,算是间接完成吧。
同时这过程中遇到一些问题,列出来纪念一下:1
2
3Error: Host key verification failed.
fatal: Could not read from remote repository.
Please make sure you have the correct access rights and the repository exists.
需设置SSH密匙来进行。且注意需删除之前生成的 git 那个文件夹。