最近想把自己的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过程中遇到的一些坑
- 如何注册免费的Travis CI,现在Travis在使用的时候需要 选择一个Plan才能够自动构建,如下图。
点击头像 -> settings
- 选择Monthly Plans页签,第一个会是Free (图中我没有因为已经选过了)
- 选择了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吧