Mac平台打造github上hexo博客全过程

Posted 2022-12-13 yanzi1225627

简介

人玩博客有三个阶段，一是在平台写，但是写着写着就会发现限制太多。比如前些年，你写个关于goagent的文章就会审核不过.博客流量来了，你想挂个广告之类的也不行。本人是受实名制的影响，在写博客上有顾忌。第二个阶段是自己购买域名和vps自己搭建后台，使用wordpress之类的博客系统，然后自己折腾点赞、评论等功能。一开始玩着挺刺激，但是维护麻烦。比如换个ip，你就要迁移整个系统，比较麻烦。再者vps也是要钱的。因此就有了第三个阶段，使用基于github提供的pages静态网页功能，既可以免费，二来迁移方便。你完全可以把整个系统备份到git上，又保证了写作的自由性，不用维护。本文介绍Mac上搭建基于github的hexo博客过程。

准备

github虽然没有明确对免费用户的空间限制，但是有说超过1G将会收到邮件通知，所以如果有担心的话最好单独注册个github用来放博客。

一.安装Node.js

在官网下载v6.9.4 LTS版本，安装即可.我们用它来生成静态网页.

如果本地有梯子，可以设置代理否则npm安装的时候可能会半天不动弹:

npm config set proxy=http://127.0.0.1:1087
npm config set https-proxy=http://127.0.0.1:1087

二.安装hexo

输入以下命令安装(有问题的话用第二个):

sudo npm install -g hexo-cli
sudo npm install --unsafe-perm --verbose -g hexo

hexo官网
新建一个目录/Users/yanzi/work/hexo,然后进到hexo目录下执行hexo init,完成后可以看到hexo目录下有以下内容:

然后在执行npm install,然后看到内容如下:

多了个db.json文件。
执行hexo g生成public静态资源，再执行hexo s(hexo server的缩写)启动本地服务端,然后浏览器输入:http://localhost:4000,即可看到效果:

三.关联github

在github上新建个仓库，名为yourname.github.io,yourname是github的用户名，这个规则不能变.然后新建一对ssh的key,将公钥添加到github,请参考https://help.github.com/articles/connecting-to-github-with-ssh/,添加SSH keys之后，就可以使用git为后缀的仓库地址，本地push的时候无需输入用户名和密码.

注意:考虑到大家不止一个github，此处如果不这样处理，使用https的仓库地址，再接下来部署时往往会出现不让输入github用户名和密码的问题!

编辑本地hexo目录下的_config.yml文件,搜索deploy关键字，然后添加如下三行:

deploy:
  type: git
  repository: [e-mail]:yourname/yourname.github.io.git
  branch: master

注意:每个关键字的后面都有个空格.

这样就关联好了github，接下来需要在hexo目录下做两件事:

1. hexo g(hexo generate的缩写)生成md文件的静态页面.md文件在hexo/source/_posts目录下。如果新写的md文件，复制到此即可. 生成的静态文件在public目录下，我们将其push到github就ok了。
2. hexo d(hexo depoly的缩写)将public文件夹东西推到仓库上，此时浏览器输入https://yourname.github.io就能看到自己博客啦!

还有个命令hexo clean作用是清除缓存db.json和public文件夹.

四.关联域名

考虑到后缀me的域名阿里万网最便宜，我就整了个,第一年才24元，在控制台---域名---解析添加两条规则:

截图里的记录值都是yourname.github.io.上述两条解析保证你的域名带不带www都能正常解析.
然后在hexo/themes/landscape/source目录下新建CNAME文件，内容为yourhost.me,即自己域名.
注意:这个CNAME文件必不可少，每次运行generate的时候会把这个路径下的东西copy到public下.
之后运行:

hexo clean
hexo g
hexo d

将东西部署到github上，输入域名就可以看到博客了。

五.使用next主题

默认的主题不太好看，我们使用点赞最高的next主题。
在博客根目录下执行:

git clone https://github.com/iissnan/hexo-theme-next themes/next

然后执行cp themes/landscape/source/CNAME themes/next/source先把CNAME文件拷贝过来。然后在博客根目录下的_config.yml下的theme的名称landscape修改为next即可。
然后执行:

hexo clean
hexo g
hexo s

就可以看到next的效果了！

六.hexo多电脑同步

很多时候人要在两台电脑上操作hexo随时发表文章，我们将整个hexo目录作为一个私有git仓库，push到http://git.oschina.net.这里没有采用不同branch的管理方式，而是将其作为一个完全独立的私有仓库，托管到码云上.

在hexo目录下执行git init,然后
注意:因为theme目录下的next也是一个git仓库，而根目录下的git仓库是管不了子仓库的。后边需要对这个next theme作大量定制，因此用submodule的方式管理不合适。我们直接把next下的.git文件夹删除即可，这样就可以被外边的git仓库管理了
然后进行一次git add .,然后git commit -m "add:first commit".之后push到你在oschina上建的仓库.

这样在另外一台电脑第一次操作时，先把hexo整个仓库git clone下来，然后在hexo目录下执行npm install hexo --save,再执行一次npm install.然后

hexo clean
hexo g
hexo s

在本地测试下。每次在不同电脑上发表博文时，先git pull一次，然后再写文章。

七.线路优化

因为github服务器在国外，博客放上边访问的话有时速度较慢，大家都懂得。幸好，https://coding.net也提供了Pages服务，每个人也是1G空间。所以可以通过线路解析，国内访问coding国外访问github.我们需要三步操作:

1.coding上建仓库

首先，注册个https://coding.net，用户名假设为username,然后新建个仓库(可以是私有哦)，名为username,即建立个跟用户名同名的仓库.然后跟github一样，把本地的ssh公钥添加进去。然后点击项目，在代码--Pages 服务，在部署来源里选中master 分支,如下图:

这样在博客推上去之后，可以通过http://username.coding.me/username访问博客。在下面可以看到自定义域名,假设域名为myhost.me,这里你需要绑定两个域名：myhost.me和www.myhost.me.如此，coding上的设置就一切ok了!
注意:域名设置一定不能少，只在域名提供商如万网上设置解析是不起作用的!!!

2.hexo本地设置

修改本地博客根目录下的_config.yml,找到deploy字段，设置如下:

deploy:
  type: git
  repository:
      github: [e-mail]:username/username.github.io.git
      coding: [e-mail]:username/username.git
  branch: master

注意：一定不要设置错了!!!
在博客根目录下的source路径下新建文件:touch Staticfile #名字必须是Staticfile
然后hexo g，再hexo d就可以把博客放到coding和github了!

3.域名提供商设置

如下图所示，给github的线路设为海外，给coding的设为默认，添加两条记录就ok了。coding添加的时候，地址写成username.coding.me,如下图所示:

后续

后面关于next主题的定制，及评论分享等下回再谈.

参考

1. http://www.jianshu.com/p/13e64c9e2295
2. next theme安装指南