盒子
盒子
文章目录
  1. 写在前面
  2. 什么是Travis CI?
  3. 构建
  4. Access Token
    1. 生成Access Token
    2. 配置Travis CI
    3. 创建文章
  5. 写在后面
  6. 更新
    1. master commit 树被清空
    2. 添加 commit 时间戳
  7. 参考

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

写在前面

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

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

什么是Travis CI?

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

构建

首先进入Travis CI官网,使用github账号登录,如下图
travis
登录成功后进入如下界面,以为我再此之前已经构建过,所以会用红色框内的内容,如果没有使用过是没有的。
list
然后点击My Repositories右边的+,添加需要自动构建的repos,进入如下页面。
new
可以看到这个界面会显示当前github账号的所以项目,如果没有显示,点击右上角的Sync account按钮,就可以同步过来了,点击需要构建的repos前面的按钮为ON,再点击其后的原形设置图标,进入如下界面
config
如图中设置,将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,就可以在构建完毕后自动pushgithub上保存静态文件的repos了。

生成Access Token

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

配置Travis CI

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

language: node_js  #设置语言

node_js: stable  #设置相应的版本

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

script:
  - hexo clean  #清除
  - hexo g  #生成

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

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

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

创建文章

我们可以创建一篇文章hexo new post use-travis-build-your-hexo-site,添加内容后,并pushgithub,正常情况下,进入Travis网站就可以看到已经在构建了,如图
success
完成后,访问链接就可以看到这篇文章了。

写在后面

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

更新

master commit 树被清空

仔细查看上面的配置文件,我们发现每次都是将 public 目录下的文件重新生成了一个git项目,然后强制覆盖提交到了 master 分支下,这就是问题的所在。
为了解决这个问题,我将配置文件改为了如下的内容:

after_script:
  - git clone https://${GH_REF} .deploy_git
  - cd .deploy_git
  - git checkout master
  - cd ../
  - mv .deploy_git/.git/ ./public/
  - cd ./public
  - git config user.name "swust-xiaoj"  #修改name
  - git config user.email "swustxiaojie@163.com"  #修改email
  - git add .
  - git commit -m "Travis CI Auto Builder"
  - git push --force --quiet "https://${travis}@${GH_REF}" master:master  #travis是在Travis中配置token的名称

在 after_script 部分,我先将博客项目 clone 到本地的 .deploy_git 目录下(目录名可自定义),然后切换到 master 分支,将 master 分支下的 .git 目录拷贝到了 public 目录下,接着继续后面的 commit 操作。

添加 commit 时间戳

按照前面的方法配置 travis.yml 的内容,在 master 分支下的提交记录是这样的:

Travis CI Auto Builder
Travis CI Auto Builder
Travis CI Auto Builder
...

看到每次的提交记录中没有提交的时间戳,所以考虑着要把 commit 的时间戳给加上。
script 命令下是可以执行 shell 命令的,所以对 travis.yml 文件进行了修改。
shell 中获取当前的时间戳,可以这样:

#/bin/bash
> date +"%Y-%m-%d %H:%M"
2018-05-05 12:13

Travis CI 中使用的linux系统在编译生成时使用的是UTC时间,这样我们在github中的提交列表中看到的提交时间就会晚8小时。我们需要在执行时将时区改为东八区。

before_install:
  - export TZ='Asia/Shanghai'

然后将after_script中的命令移到单独的shell文件中。最终的两个文件内容如下

> build.sh
#!/bin/bash
set -ev

git clone https://${GH_REF} .deploy_git
cd .deploy_git
git checkout master

cd ../
mv .deploy_git/.git/ ./public/

cd ./public

git config user.name "swust-xiaoj"  #修改name
git config user.email "swustxiaojie@163.com"  #修改email
git add .
git commit -m "Travis CI Auto Builder at `date +"%Y-%m-%d %H:%M"`"

git push --force --quiet "https://${travis}@${GH_REF}" master:master  #travis是在Travis中配置token的名称
> .travis.yml
language: node_js

node_js: stable

cache:
  apt: true
  directories:
    - node_modules
before_install:
  - export TZ='Asia/Shanghai' # 更改时区
  - npm install hexo-cli -g
  - chmod +x ./build.sh  # 为shell文件添加可执行权限

install:
  - npm install

script:
  - hexo clean
  - hexo g

after_script:
  - ./build.sh

branches:
  only:
    - master
env:
 global:
   - GH_REF: github.com/swust-xiaoj/swust-xiaoj.github.io.git

参考