原文链接(转载请注明出处):使用Travis CI自动部署Hexo到GitHub

前言

使用 hexo + gitPages 搭建个人博客的人都知道,每当要发表一篇博文,第一步得手动使用 hexo g 命令生成静态网页,然后还得通过 hexo d 命令将静态文件推送到GitHub远程仓库,不说麻烦不麻烦,更重要的是有时候环境换了,没有搭建 hexo 环境,想发篇博客的时候就没有可能了。而现在通过 Travis CI 就能自动构建自己的博客。我们只需将写好的 Markdown 格式的博文push 到 hexo源文件 分支即可。

Travis CI 介绍

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

hexo 介绍

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

使用 Travis 自动构建

我的博客自动部署思路是,将 hexo 源码 push 到博客 项目的另外一个分支,

既一个分支放源码,一个分支放静态文件,使用 Travis CI 自动部署 hexo 源码的分支,构建完成后自动推送到 静态文件的分支上,而这一切都在一个仓库上进行操作。

注意:如果使用的是GitPage的个人站点来搭建博客的 ,则博客静态文件在 master分支上;如果使用的是 gitPages 的项目站点来搭建博客,则博客的静态文件在 gh-pages 分支上。

在GitHub 上生成 Access Token

如果想要 让travis CI 构建完成之后自动 push 到 master 分支,则travis需要有对这个仓库进行操作的权限,此时我们就需要为Travis CI 配置Access Token(访问令牌)。

在GitHub上生成Access Token 的步骤是,点击头像进入设置(Settings),r然后点击左边菜单栏最下面的Developer settings 选项,进入后点击左边的 Personal access tokens 选项,进入后点击右上角的Generate new token 按钮



点击后就会来到下面的界面,先给 Token 起一个名字,然后为它设置一些权限,其中红框内的权限是必须的,其他可以随意添加。



点击下面的 create token 按钮,就会生成一个已经赋予好权限的 token 值,接下来我们Travis CI 网站的配置中。

配置 Travis CI

如果之前从未使用 Travis CI 来构建项目,则我们先需要使用GitHub账号来登录网站,登录进来后,会进到如下图界面,如果底下 没有把 GitHub 仓库中的项目加载进来,可以手动点击右上角的 Sync account 按钮,待到同步完成后将要自动构建的项目开启。



开启后点击设置图标就可以进行一系列的设置,如下图所示,先开启 General 里的两项选项:

  • Build only if .travis.yml is present:只有在.travis.yml文件中配置的分支改变了才构建
  • Build branch updates:当分支更新后开始构建

然后在 Environment Variables 一栏里将在 GitHub 下获取的的 Access Token 值添加进来

添加配置文件到Hexo源码分支下

上面提到的 .travis.yml 配置文件需要添加到hexo 源码的根目录下,因为Travis CI 在自动构建时需要获取这些配置信息,以此来完成构建任务;这些配置信息主要包括源码分支,静态文件推送分支,仓库地址等信息。



其中主要内容如下:

language: node_js
node_js: stable # S: Build Lifecycle
install:
- npm install #before_script:
# - npm install -g gulp script:
- hexo g after_script:
- cd ./public
- git init
- git config user.name "dmego" --{GitHub账户名称}
- git config user.email "zengkai12138@outlook.com" --{Github账户邮箱}
- git add .
- git commit -m "Update docs"
- git push --force --quiet "https://${GH_TOKEN}@${GH_REF}" master:master
# E: Build LifeCycle branches:
only:
- hexo --{Hexo源码分支名称}
env:
global:
- GH_REF: github.com/dmego/dmego.github.io.git --{仓库地址}

配置到这一步就已经把所有配置全部完成,下面就是验证的过程

构建并自动部署结果

将某篇文章中的一个表格增加一行后将修改推送到hexo源码所在的hexo分支

,然后等Travis CI 构建并自动部署成功后。



点击博文发现表格多了一行。

总结

这样做虽然能很好的实现自动部署的功能,但是有个问题也要注意,就是博客源码公开问题,如果对博客源码不介意的可以直接使用公开仓库,如果介意那就没有办法了,除非使用付费的私有仓库,或者把项目放在Coding上去,因为上有提供免费的私有仓库。就我个人认为,既然是自己的博客,本来就是要给人看的,博客源码也谈不上存在什么隐私。

使用Travis CI自动部署Hexo到GitHub的更多相关文章

  1. 使用Travis CI自动部署Hexo博客

    自从使用GitHub Pages和Hexo来发布博客之后,不得不说方便了许多,只需要几个简单的命令博客就发布了.但在不断的使用中发现每次的发布操作也挺耗时的. 我一般的操作是将平时整理好的md文件放到 ...

  2. 使用 Travis CI 自动部署 Hexo 站点至 GitHub Pages

    Hexo 与 GitHub Pages 安装配置请参考:Hexo 与 GitHub Pages 本文源码与生成的静态文件在同一项目下,源码在 source 分支,静态文件在 master 分支 新增 ...

  3. 使用Travis CI自动部署博客到github pages和coding pages

    每次换系统或换电脑之后重新部署博客总是很苦恼?想像jekyll那样,一次性部署完成后,以后本地不用安装环境直接 git push 就能生成博客?那推荐你应该使用使用 Travis CI了. 这篇文章我 ...

  4. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(四)-使用Travis自动部署Hexo(2)

    前言 前面一篇文章介绍了Travis自动部署Hexo的常规使用教程,也是个人比较推荐的方法. 前文最后也提到了在Windows系统中可能会有一些小问题,为了在Windows系统中也可以实现使用Trav ...

  5. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(三)-使用Travis自动部署Hexo(1)

    前言 前面两篇文章介绍了在github上使用hexo搭建博客的基本环境和hexo相关参数设置等. 基于目前,博客基本上是可以完美运行了. 但是,有一点是不太好,就是源码同步问题,如果在不同的电脑上写文 ...

  6. 用GitHub Actions自动部署Hexo

    什么是 GitHub Actions ? GitHub Actions 是一个 CI/CD(持续集成/持续部署)工具,GitHub 于 2018 年 10 月推出,正式版于 2019 年 11 月正式 ...

  7. Gitlab CI 自动部署 asp.net core web api 到Docker容器

    为什么要写这个? 在一个系统长大的过程中会经历不断重构升级来满足商业的需求,而一个严谨的商业系统需要高效.稳定.可扩展,有时候还不得不考虑成本的问题.我希望能找到比较完整的开源解决方案来解决持续集成. ...

  8. 部署hexo后github pages页面未更新或无法打开问题

    title: 部署hexo后github pages页面未更新或无法打开问题 date: 2018-03-30 15:34:29 categories: methods tags: hexo gith ...

  9. 基于 Github Actions 自动部署 Hexo 博客

    前言 前不久使用了 Hexo 搭建独立博客,我是部署在我的腾讯云轻量应用服务器上的,每次都需要 hexo deploy 然后打包.上传.解压和刷新 CDN,非常麻烦.我的服务器配置也不高 2C2G 无 ...

随机推荐

  1. 线性表之何时使用ArrayList、LinkedList?

    前言 线性表不仅可以存储重复的元素,而且可以指定元素存储的位置并根据下表访问元素. List接口的两个具体实现:数组线性表类ArrayList.链表类LinkedList. ArrayList Arr ...

  2. UX是什么?

    UX(用户体验),操作过安卓手机或者苹果手机的系统吧?那么操作过程的整体体验就叫UX,而操作过程中所看到的界面颜色啦,图案,字体大小啦等等都属于UI设计,而交互设计(Interaction Desig ...

  3. 软件工程(GZSD2015)第三次作业

    时间: 2015/4/17-2015/4/23 基本要求: 在之前编写的四则运算程序基础之上做如下改进: 请参照教材Page57:4.2-4.3节中内容,修改原程序,使之符合 "代码风格和设 ...

  4. 团队作业6——展示博客(Alpha版本)

    Deadline: 2017-5-7 22:00PM,以博客发表日期为准 评分基准: 按时交 - 有分,检查的项目包括后文的四个方面 团队成员介绍 Alpha阶段进展 团队合作,各成员分工 Beta阶 ...

  5. 201521123079《java程序设计》第8周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 2. 书面作业 本次作业题集集合 1.List中指定元素的删除(题目4-1) 1.1 实验总结 这题主要是对函 ...

  6. (转载)Oracle12g安装图解与安装过程常见问题注意事项

    首附转载地址:http://jingyan.baidu.com/article/f96699bbab21c0894e3c1bf8.html 首先,点击"setup",建议以管理员身 ...

  7. 网络配置之基本网络配置(cenos6)

    目录: 关于IP的管理 Linux网卡的卸载与装载 配置网络接口 网络IP配置文件路由管理 路由管理命令 配置动态路由(简介) route的配置文件netstat命令IP命令 ip link 查看网络 ...

  8. [js高手之路]Node.js+jade+mongodb+mongoose实现爬虫分离入库与生成静态文件

    接着这篇文章[js高手之路]Node.js+jade抓取博客所有文章生成静态html文件继续,在这篇文章中实现了采集与静态文件的生成,在实际的采集项目中, 应该是先入库再选择性的生成静态文件.那么我选 ...

  9. JSP知识点大纲图

    这是我整理出来的JSP知识点大纲图,具体的内容都可以在我的博文中找到-.

  10. global,local,static的区别

    1.在函数内部使用global关键字定义的变量可以成为全局变量,如果该变量已经被定义了,那么他的值就是原来的值,否则就是一个新的全局变量(一句话:已存在就不再创建): <?php $a=1; f ...