利用Hexo GitHub Page和 travis CI搭建播客

  • Post author:
  • Post category:其他


最近想把自己的blog搬到github上,顺便做梳理总结归档。结果发现2016年自己用github pages搭建的博客,没有上传源码,只是把发布的传上去了。我又换了电脑找不到了,所以想重新用hexo和github pages 使用travis ci作为构建工具搭建下自己的blog。结果费了不少功夫。



一. 工具说明

  • github pages : 是github提供的一个静态网站托管服务,通过github提供的服务可以直接通过固定模式的域名:{username}.github.io来访问发布的静态网页。
  • hexo 框架: Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

    戳此进入官网
  • travis CI:持续集成工具类比jenkins,高度集成github,并且针对开源项目提供免费使用,所以如果是个人blog的话可以使用。

    重点:https://www.travis-ci.org这个地址已经成为了read-only网上的好多资料都没更新,现在要使用的话使用:https://www.travis-ci.com/【有一些坑,下边步骤会强调】



二. 搭建步骤

注册github,并且创建项目,网上资料比较多,下边链接是我参考的


戳此:github pages + hexo + travis ci 部署个人博客



三. FAQ


以下是我重点描述的我在注册Travis CI过程中遇到的一些坑

  1. 如何注册免费的Travis CI,现在Travis在使用的时候需要 选择一个Plan才能够自动构建,如下图。

    点击头像 -> settings

    进入选择plan入口

    点击plan 页签
  2. 选择Monthly Plans页签,第一个会是Free (图中我没有因为已经选过了)

    选择Free
  3. 选择了free也需要填写个人信息,其中包括需要绑定个人信用卡。

    填写个人信息

    图上的卡号填写

    1. 信用卡卡号 2.月份/年份 3.卡安全码

    都需要填写,卡安全码是信用卡后边七位的后三位或者四位,根据所在行去查询。

    绑定信用卡后会预扣6块钱,一周后会返还。

    扣款描述



四. 选择不同的主题 [选读]


  • 戳此

    进入hexo主题官网选择自己喜欢的主题。
  • 将主题clone到自己blog项目下新建一个themes文件夹下,并且修改hexo blog 的_.config.yml文件theme的值。
  • 因为我用了两个分支使用 main分支管理源码,gh-pages来发布静态页面。所以需要把themes文件夹也提交打main分支上去。

    注意:不要使用git submodules

    。然后在_.travis.yml 动态编译 主题文件夹。
  • github中将master分支改名为了main分支所以还存在换名字脚本,全文的 _.travis.yml如下
language: node_js
node_js: stable  #要安装的node版本为当前的稳定版
cache:
  directories:
    - node_modules  #要缓存的文件夹
    - themes/tranquilpeak/node_modules  #我自己的主题文件夹
install:
  # - npm install hexo-cli -g
  - cd themes/tranquilpeak
  - npm install && npm run prod   #编译主题
  - cd ../..
  - npm install
script:
  - hexo clean  #清除
  - hexo g  #生成
after_script:  #最后执行的命令
  - cd ./public
  - git init
  - git config user.name "topsion"
  - git config user.email "****@163.com"
  - git branch -m master main   #重命名master 改为main分支
  - git add .
  - git commit -m "automatic code deployment"
  - git push --force --quiet "https://${GH_TOKEN}@${GH_REF}" main:gh-pages  #hexoblog_token与travis ci设置的环境变量名相同
branches:
  only:
    - main #触发持续集成的分支
env:
  global:
    - GH_REF: github.com/{userName}/{userName}.github.io.git #就是github上存放博客最终文件的仓库地址末尾加上.git



追加 2022-02-28

用了三周用不了了,要付费,各位别折腾了,还是用github action吧



版权声明:本文为wenpeng12原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。