mac上hexo博客的搭建

Mac上hexo博客的搭建

​ 第一篇hexo博客，介绍了在mac上搭建hexo博客的全过程。包括：准备工作、本地站点的建立、启动和部署站点、创建新文章、发布到github、更换主题 和 绑定域名。
在介绍之前先秀一波我搭的成果: 夏天的风的博客

准备工作

1. github
2. homebrew
3. node.js 和 npm
4. hexo

github

1、github账号

​ 这部分略过，没有的话自己注册一个。然后将mac上的公钥添加到github上去。

2、建立仓库

​ 严格按照 git用户名.github.io 来命名。我这里就叫：xiaqunfeng.github.io 。

homebrew

homebrew 是MAC OSX 上面用来安装 或者 卸载软件用的非常方面的一个软件。在终端上执行如下命令即可安装，参考官网。

sudo /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

node.js

不推荐使用 brew 安装node， 直接从官网下载，然后双击安装。我这里选择的版本是：v6.9.3 LTS。node.js 集成带有npm。

$ node -v
v6.9.3

$ npm -v
3.10.10

hexo

$ sudo npm install hexo-cli -g

安装完后

$ hexo -v
hexo: 3.2.2
hexo-cli: 1.0.2
os: Darwin 16.1.0 darwin x64
http_parser: 2.7.0
node: 6.9.3
v8: 5.1.281.89
uv: 1.9.1
zlib: 1.2.8
ares: 1.10.1-DEV
icu: 57.1
modules: 48
openssl: 1.0.2j

hexo命令行使用

常用命令：
hexo help                   #查看帮助
hexo init                   #初始化一个目录
hexo new "postName"         #新建文章
hexo new page "pageName"    #新建页面
hexo generate               #生成网页，可以在 public 目录查看整个网站的文件
hexo server                 #本地预览，'Ctrl+C'关闭
hexo deploy                 #部署.deploy目录
hexo clean                  #清除缓存，强烈建议每次执行命令前先清理缓存，每次部署前先删除 .deploy 文件夹

简写：
hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy

建立本地站点

执行下列命令，Hexo 将会在指定文件夹中新建所需要的文件。（文件夹不需要提前建好，会自行创建）

$ hexo init <folder>
$ cd <folder>
$ npm install

新建文件夹目录如下：

.
├── .deploy         #需要部署的文件
├── node_modules    #Hexo插件
├── public      #生成的静态网页文件
├── scaffolds   #模板
├── source      #博客正文和其他源文件
| ├── _drafts   #草稿(刚开始没有)
| └── _posts        #文章
├── themes      #主题
├── _config.yml     #全局配置文件
└── package.json

启动站点

执行 hexo server 启动站点

$ hexo s
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

在浏览器中输入：http://localhost:4000 就可以看到站点了。

部署站点

编辑文件 _config.yml ，修改如下：

deploy:
   type: git
   repository: https://github.com/xiaqunfeng/xiaqunfeng.github.io.git
   branch: master

注意：冒号后面要留 空格！！

创建新文章

方法1、hexo n创建新文章

$ hexo n "我的第一篇hexo博客"
INFO  Created: ~/hexo-blog/source/_posts/我的第一篇hexo博客.md

然后用编辑器打开编辑即可。

方法2、直接在 source/_posts 中新建一个md文件，进行编辑

在hexo-blog文件夹下执行：

hexo g
hexo s

然后在浏览器中输入http://localhost:4000就可以看到新加的文章了。

发布

执行 hexo d ，发现如下问题

$ hexo d
ERROR Deployer not found: git

解决方法

$ npm install hexo-deployer-git --save
hexo-site@0.0.0 /Users/xiaqunfeng/hexo-blog
└── hexo-deployer-git@0.2.0 

再执行 hexo d

$ hexo d
INFO  Deploying: git
INFO  Clearing .deploy_git folder...
INFO  Copying files from public folder...
On branch master
nothing to commit, working tree clean
Username for 'https://github.com': xiaqunfeng
Password for 'https://xiaqunfeng@github.com': 
To https://github.com/xiaqunfeng/xiaqunfeng.github.io.git
 * [new branch]      HEAD -> master
Branch master set up to track remote branch master from https://github.com/xiaqunfeng/xiaqunfeng.github.io.git.
INFO  Deploy done: git

输入github的用户名和密码即可。此时，博客已经完全搭建起来了。

在浏览器中输入：https://xiaqunfeng.github.io/ 即可访问。

预览如下：

更换主题

自己google一下hexo主题，选一个自己喜欢的，然后git clone下来。比如 Next 主题

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

然后打开_config.yml文件，替换其中的 theme 属性，默认为 landscape。

theme: next

本地调试

$ hexo g #生成静态页面，生成的内容在public文件夹下
$ hexo s #启动本地服务，进行文章预览调试。hexo s --debug 命令可以用来调试

发布到github

1、清理之前生成的内容，即public文件。

注意：这一步必须要，不然有时因为缓存问题，服务器更新不了主题

$ hexo clean 

2、生成静态文件并部署到github

$ hexo g #生成静态文件
$ hexo d #部署到github

上面两个命令可以合并为一个：

$ hexo d -g #在部署前先生成

绑定域名

我暂时还没购买和绑定域名，就暂时先简单介绍一下，后续再来补充完善。

1、购买域名

某乎这里有各种推荐，自己可以参考的看看。

godaddy地址: https://www.godaddy.com

阿里云域名地址: http://wanwang.aliyun.com

2、到自己的gitHubPages的ip地址

ping http://xiaqunfeng.github.io
PING github.map.fastly.net (151.101.192.133): 56 data bytes
64 bytes from 151.101.192.133: icmp_seq=0 ttl=49 time=62.670 ms
64 bytes from 151.101.192.133: icmp_seq=1 ttl=49 time=65.062 ms
...

这里IP地址为：151.101.192.133

3、域名绑定IP地址

登录自己购买域名的地方，找到域名相关选项

添加域名

添加记录：一个主机记录 @， 一个为www，记录值都是博客主页对应的ip。

等待生效，最迟72小时生效，然后就可通过域名浏览你的博客主页了。