使用 Hexo + Github 搭建博客教程，支持在新电脑同步

安装环境

本地安装git, node

安装hexo

使用npm安装hexo，官方提供的详细安装方法：
https://hexo.io/zh-cn/docs/

安装一些必要的插件：

$  sudo  npm install hexo-deployer-git --save    //安装Git部署器
$  sudo npm install hexo-generator-index --save 
$  sudo npm install hexo-generator-archive --save 
$  sudo npm install hexo-generator-category --save 
$  sudo npm install hexo-generator-tag --save 
$  sudo npm install hexo-server --save 
$  sudo npm install hexo-deployer-heroku --save 
$  sudo npm install hexo-deployer-rsync --save 
$  sudo npm install hexo-deployer-openshift --save 
$  sudo npm install hexo-renderer-marked@0.2 --save 
$  sudo npm install hexo-renderer-stylus@0.2 --save 
$  sudo npm install hexo-generator-feed@1 --save 
$  sudo npm install hexo-generator-sitemap@1 --save

GitHub准备工作

1. 在github上新建一个仓库，命名规则为 git用户名.github.io。仓库默认有个master分支。

2. 另新建一个分支 gh_pages，并将此分支设置为 default_branch（默认分支）。
   该分支用来存放和管理整个开发项目的代码，我们只需要手动管理gh_pages分支。
   通过 hexo d 部署命令会将生成的文件自动提交到master分支。

3. 将GitHub的空项目仓库clone到本地。本地新建一个分支 gh_pages, 切换到这个分支。
   然后一直在此分支下开发，推送远程的时候也是推送到gh_pages同名远程分支。

$  git clone <git项目的url>
$  cd username.github.io
$  git checkout -b gh_pages

hexo流程

1. 新建本地站点

安装完hexo后，在项目根目录(username.github.io)下，运行以下命令，会自动生成项目所需文件。

$  hexo init
$  npm install

完成后，文件夹中目录如下：

├── _config.yml
├── package.json
├── scaffolds
├── source
|    └── _posts
|
└── themes

因为要将此项目推送到远程GitHub，我们需要添加一个 .gitignore 文件，忽略掉安装的插件，因为其没必要提交到远程：

// .gitignore
node_modules

然后，运行 hexo server启动站点。

$  hexo server   // 可简写为 hexo s

站点默认链接为 http://0.0.0.0:4000 或 http://localhost:4000 ，在浏览器打开此地址即可看到站点了。

2. 新建文章

$  hexo new '文章标题'

会在source/_posts/ 目录下生成一个新的markdown格式的文件。
在此文件编辑和保存自己的新文章。

3. 生成 html js 站点文件

$  hexo generate    // 可简写为 hexo g

会在 public 文件夹中生成页面需要的完整的html js等文件。

4. 发布

发布之前，先需要在根目录的 _config.yml 配置文件里关联上你的 github 地址。

// _config.yml

deploy:
  type: git
  repository: <git项目的url>
  branch: master

// 然后在命令行运行 hexo deploy，首次运行会按要求填写GitHub账号和密码
$  hexo deploy     // 可简写为 hexo d

这样，会把 public 文件夹里面的文件，推送到github仓库里。
然后，在浏览器中打开 <username>.github.io 就可以看到所搭建的线上的静态页面了。

安装主题

在网上找到自己喜欢的主题，clone到 themes 文件夹下。
以安装even主题为例，在根目录下运行如下命令：

$  git  clone  https://github.com/ahonn/hexo-theme-even  themes/even

修改根目录下的 _config.yml 文件，将主题名字改为 even

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: even

运行以下命令就可以看到新主题的效果了：

$  hexo g    // 生成
$  hexo s    // 开启本地服务预览
$  hexo d    // 发布

一定要把主题文件也提交到远程仓库，可以自己自定义主题样式，换电脑后还可以同步自己配置的主题。
此时本地的git仓库跟踪不到 /themes 文件下新加的主题文件。我们只需要把 /themes/even 文件目录下的 .git 文件夹删除就可以了。

$  rm -rf .git

然后 /themes/even 下的文件就可以被 git 跟踪到了。

推送到远程

文章发布完后，我们把本地仓库推送到远程仓库的 gh_pages 分支。

$  git commit -am 'add hexo'
$  git push origin gh_pages

在新电脑上同步这个项目(包括主题)，步骤：

$  git clone <git项目的url> 
$  cd username.github.io      // 默认分支为 gh_pages

$  npm install hexo -g
// 此时不需要在项目根目录运行 hexo init 命令，否则会将所有文件初始化掉。
$  npm install
$  hexo s      // 看是否能成功开启本地服务了

$  hexo new 'new article title'
$  hexo g
$  hexo d

$  git commit -am 'add hexo files'
$  git push origin gh_pages