一、前言
使用hexo + gitPages
搭建好个人博客后,每当要发表一篇博文,第一步得手动使用hexo g
命令生成静态网页,然后还得通过hexo d
命令将静态文件推送到GitHub
远程仓库,虽然不算繁琐且可以编写批处理命令进行简化,但是有更简单的,为何不用呢?
我们可以通过 Travis CI
实现自动化构建自己的博客,我们只需将写好的Markdown
格式的博文,我们将博文推送(push
)到GitHub
的时候,就可以触发自己编写好的脚本,实现自动化部署。
首先我们需要了解Travis CI
分为两种:
- Travis CI .org for public repositories【公共仓库】
- Travis CI .com for private repositories【私有仓库】
针对私有仓库的当然是收费的,接下来我们使用的是 Travis CI .org
。
二、Travis CI 自动化构建实现
2.1 登录Travis CI.org
首先我们使用GitHub
账号登录 Travis CI .org ,然后我们我们就进入如下界面:
第一次进入可能下面没有你的仓库列表,我们可以点击右上角的Sync Account
即可。
2.2 添加自动化构建仓库
其实上图中已经看到了,我们将需要自动化构建仓库前面的开关打开即可!当然我们可以回到主页[点击网站图标],然后进行如下操作:
然后也就跳转回你的Profile
界面了,我们打开自己要实现自动化构建的仓库:
注意:需要是你的博客源码的仓库,我的博客源码与网站的静态文件是两个仓库,其实使用一个仓库,选用两个分支即可!
2.3 设置仓库
我们需要打开下面的几个开关:
说明:
- Build only if .travis.yml is present:只有在
.travis.yml
文件中配置的分支改变了才构建 - Build pushed branches:当推送完这个分支后开始构建
至此, 我们已经开启了要构建的仓库,但是构建完后,我们怎么将生成的文件推送到github上呢?
我们使用Travis CI服务的目标是,我们只要将博文源文件推送到GitHub,Travis CI就自动构建并push
静态文件到GitHub Pages!
接下来,我们就是为Travis CI赋予操作GitHub的权利了!
2.4 GitHub生成Personal access tokens
我们登录GitHub后进入设置界面,选择最下面的Developer settings:
接下来就是生成Personal access tokens
:
我们需要为此赋予权限,此处我除了删除权限,其它一股脑都赋予了:
注意:Personal access tokens
生成后会在上方显示出来,我们应当立即复制此秘钥,否则你将再也看不到了!
2.5 在Travis CI配置Personal access tokens
当然,我们也可以在配置文件中书协自己的Personal access tokens,但是配置文件与源码是放在一起的,别人获得了此钥匙就相当于可以控制你的GitHub了,当然非常不安全,因此还是建议在网站上进行配置!
2.6 编写配置文件
配置文件的配置时非常灵活的,且方式多样,但是的主要目标已经确定,只需在我的配置文件的基础上修改自己的个人信息即可。我们首先在博客的根目录下创建.travis.yml
文件,下面是我的配置信息:
language: node_js #设置语言
node_js: node
# 缓存node_modules文件夹,节省部署的时间
#cache:
# directories:
# - node_modules
# 源码所在分支
branches:
only:
- master
# 安装依赖
install:
- npm install hexo-cli -g
- npm install hexo-generator-searchdb --save
- npm install hexo-generator-feed --save
- npm uninstall hexo-generator-index --save
- npm install hexo-generator-index-pin-top --save
- npm install
# 执行的命令
script:
- hexo clean
- hexo generate
# 部署
deploy:
provider: pages
skip-cleanup: true
github-token: $GITHUB_TOKEN # Set in travis-ci.org dashboard, marked secure
keep-history: true
local-dir: public
repo: fxb577328725/fxb577328725.github.io # 你的GitHub Page仓库地址
target-branch: master
至此,一切就绪!你可以编写一篇博文,然后推送到GitHub进行测试,如果你查看的比较快的话,你还可以看到Travis CI网页上执行的全过程,当然最终也可以看到其全貌!
注意:构建成功不完全代表部署成功了,你需要等一下查看个人博客确认一下!