Hexo+GitHub搭建静态博客平台(六)-使用Travis CI实现自动化部署

一、前言

使用hexo + gitPages搭建好个人博客后,每当要发表一篇博文,第一步得手动使用hexo g命令生成静态网页,然后还得通过hexo d命令将静态文件推送到GitHub远程仓库,虽然不算繁琐且可以编写批处理命令进行简化,但是有更简单的,为何不用呢?。

我们可以通过 Travis CI 实现自动化构建自己的博客,我们只需将写好的Markdown格式的博文,我们将博文推送(push)到GitHub的时候,就可以触发自己编写好的脚本,实现自动化部署。

首先我们需要了解Travis CI分为两种:

针对私有仓库的当然是收费的,接下来我们使用的是 Travis CI .org

二、Travis CI 自动化构建实现

2.1 登录Travis CI.org

首先我们使用GitHub账号登录 Travis CI .org ,然后我们我们就进入如下界面:


6_2.1

第一次进入可能下面没有你的仓库列表,我们可以点击右上角的Sync Account即可。

2.2 添加自动化构建仓库

其实上图中已经看到了,我们将需要自动化构建仓库前面的开关打开即可!当然我们可以回到主页[点击网站图标],然后进行如下操作:


6_2.2-1

然后也就跳转回你的Profile界面了,我们打开自己要实现自动化构建的仓库:


6_2.2-2

注意:需要是你的博客源码的仓库,我的博客源码与网站的静态文件是两个仓库,其实使用一个仓库,选用两个分支即可!

6_2.2-3

2.3 设置仓库


6_2.3-1

我们需要打开下面的几个开关:


6_2.3-2

说明:

  • 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:


6_2.4-1

接下来就是生成Personal access tokens


6_2.4-2

我们需要为此赋予权限,此处我除了删除权限,其它一股脑都赋予了:


6_2.4-3

注意:Personal access tokens生成后会在上方显示出来,我们应当立即复制此秘钥,否则你将再也看不到了!


6_2.4-4

2.5 在Travis CI配置Personal access tokens


6_2.5

当然,我们也可以在配置文件中书协自己的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网页上执行的全过程,当然最终也可以看到其全貌!

注意:构建成功不完全代表部署成功了,你需要等一下查看个人博客确认一下!


6_2.6

求赞

猜你喜欢

转载自blog.csdn.net/fanxiaobin577328725/article/details/79598306