使用Travis CI自动部署Hexo博客到Github上

写在前面

自从在github page上搭建博客以来，都是使用的hexo，每次都是通过hexo命令build生成静态文件，再push到github上，后来找到一个deploy插件，只需要填写好github的repos地址就好。但是源码的保存是个问题，更换电脑想要写博客很不方便，甚至蠢到将源码保存到u盘里面，这样每次提交后又要备份一次，很容易忘记。说到这里那为什么不将源码保存到github上呢。

其实也是因为懒，给博客换了几次主题后，使得博客源码很乱，甚至自己也忘了改了主题的哪些代码，加上主题也是个repos，直接提交博客源码是提不上的，涉及到子模块问题，麻烦。想到自己还喜欢改动别人的主题，索性将主题文件夹.git文件删掉，让他成为一个普通的文件夹，这样就能提交到github了。废话不多说，估计是很久没写博客了，没有重点，下面简单说说使用Travis CI自动部署Hexo博客到github上。

什么是Travis CI？

Travis CI 是目前新兴的开源持续集成构建项目，它与jenkins，GO的很明显的特别在于采用yaml格式，简洁清新独树一帜。目前大多数的github项目都已经移入到Travis CI的构建队列中，据说Travis CI每天运行超过4000次完整构建。

构建

首先进入Travis CI官网，使用github账号登录，如下图

登录成功后进入如下界面，以为我再此之前已经构建过，所以会用红色框内的内容，如果没有使用过是没有的。

然后点击My Repositories右边的+，添加需要自动构建的repos，进入如下页面。

可以看到这个界面会显示当前github账号的所以项目，如果没有显示，点击右上角的Sync account按钮，就可以同步过来了，点击需要构建的repos前面的按钮为ON，再点击其后的原形设置图标，进入如下界面

如图中设置，将Build only if .travis.yml is present及另外两个设置为ON，功能如字面意思不多说。
到目前为止，已经将需要构建的repos开启，那么，我们如何在将源码提交到github的时候，它就自动构建并将build后的静态文件push到我的静态文件branch或者repos呢（我是将build后的静态文件放到一个单独的repos了，也可以放在源码repos的另一个branch，例如起名叫hexo），接下来说如何让Travis CI访问github.

Access Token

我们需要在Travis上配置Access Token，就可以在构建完毕后自动push到github上保存静态文件的repos了。

生成Access Token

登录github，进入个人主页，点击setting，进入界面后找到下图所指位置。

点击Personal access tokens，进入页面后，在点击右上角Generate new token,会再次让输入github密码，然后在Token description下起一个名字，再勾选一些权限，我是全给勾选上了，在点击下面Generate token这里就不多截图了。复制生成的token码。

配置Travis CI

回到Travis的setting页面，如上面图，在Environment Variables这一栏，点击Add，起一个名字到Name，将复制的token码粘贴到Value框中，到这步为止，已经完成了Travis的设置。到博客源码根目录，创建一个.travis.yml的配置文件，内容如下，附注释，注意缩进

language: node_js  #设置语言

node_js: stable    #设置相应的版本

install:
  - npm install    #安装hexo及插件

script:
  - hexo clean     #清除，或者缩写hexo c
  - hexo generate  #生成，或者缩写hexo g

after_script:
  - cd ./public
  - git init
  - git config user.name "smuwjs"  #修改name
  - git config user.email "smuwjs@163.com"  #修改email
  - git add .
  - git commit -m "update site"
  - git push --force  "https://${travis}@${GH_REF}" master:master  #travis是在Travis中配置token的名称

branches:
  only:
    - blog-source  #只监测blog-source，可根据自己情况设置，若是存放同一个仓库，这儿可以选择存放源码的branch，如hexo
env:
 global:
   - GH_REF: github.com/smuwjs/smuwjs.github.io.git  #设置GH_REF，注意更改yourname

因为我是新起了一个repos来存放静态文件了，所以上面的GH_REF是对应那个repos地址，若是放同一个repos中，那这儿一般都是yourname.github.io那个仓库。到此，配置已经完成了。

创建文章

我们可以创建一篇文章hexo new post use-travis-build-your-hexo-site，添加内容后，并push到github，正常情况下，进入Travis网站就可以看到已经在构建了，如图

完成后，访问链接就可以看到这篇文章了。

写在后面

很久没有花时间写点东西了，不管有没有价值，总是一种对知识的积累和总结，输出也意味着输入，所以以后还是将学到的东西和积累总结下，自己可以将知识梳理的同时能帮助到别人是更好的了。