使用 Travis CI 生成 hexo 博客

发表于 更新于 分类于 Waline： 阅读次数：

之前在 vps 搭建了简单的 hexo 工作环境，配合 git 发布插件可以一键发布网页。最近发现了 Travis 自动集成工具，可以方便的读取 GitHub repo 进行自动集成，只需要注册后简单配置 .travis.yml 即可借助 Travis CI 的发布功能直接更新到 git pages。下面简单介绍配置过程和遇到的问题。
相比之前的方法优雅省力许多。

绑定 Travis CI

添加 Travis CI 到你的 GitHub 账号，并允许 Travis CI 访问你的 repo。

生成一个新的 token，勾选 repo 权限，然后把 token value 存储到 Travis CI 的环境变量 GITHUB_TOKEN 中去。

编写 Travis CI 配置

下面直接给出参考配置，来自 Hexo 官方文档 并稍做修改。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
language: node_js
node_js: stable
cache: npm
branches:
  only:
  - master
git:
  depth: false
before_install: # 恢复之前文章的修改时间
- export TZ='Asia/Shanghai'
- "git ls-files -z | while read -d '' path; do touch -d \"$(git log -1 --format=\"@%ct\" \"$path\")\" \"$path\"; done"
script:
- hexo generate
deploy:
  provider: pages
  skip_cleanup: true
  github_token: $GITHUB_TOKEN
  keep_history: true
  on:
    branch: master
  repo: Editst/editst.github.io
  local_dir: public
  target_branch: master

注意如果使用了第三方主题，需要使用子模块添加相应的主题。

上传至 GitHub

至此全部配置结束，检查工作目录是否包含下面所有目录和文件。

1
2
3
4
5
6
7
8
9
10
11
12
13
.
├── .travis.yml
├── _config.yml
├── db.json
├── package.json
├── scaffolds
├── source
│   ├── CNAME
│   ├── _posts
│   ├── categories
│   ├── img
│   └── tags
└── theme

然后就可以开心地上传到 GitHub 享受持续集成的快感了。可以去官网查看实时的 log 输出，排查问题。祝一次成功！

折腾版

下面是之前的方法，要麻烦不少，想折腾的话随意。

注册 Travis

使用 GitHub 账号在官网进行绑定，选择上传源码的 repo 绑定即可。

安装 Travis CML

如果不需要使用 Travis 进行文件加密来保护密钥等内容，可以略过这一步。在这里由于要进行发布操作，必须 ssh 私钥，因此使用 Travis 对私钥文件进行加密，保护安全。如果你对 GitHub 足够放心，可以创建私有仓库并直接上传私钥，省略该步骤。不过十分不建议这样做。

首先确保 vps 装有 ruby，然后安装 Travis CML，按提示登录 GitHub 账号即可。

1
2
$ gem install travis
$ travis login

编辑 travis 配置

下面直接给出我的配置文件，参考自基于 Hexo 的全自动博客构建部署系统

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
language: node_js
node_js: stable
branches:
  only:
  - master
cache:
  directories:
    - node_modules
before_install:
# 配置ssh
- mv id_ed25519 ~/.ssh/
- chmod 600 ~/.ssh/id_ed25519
- eval $(ssh-agent)
- ssh-add ~/.ssh/id_ed25519
- cp ssh_config ~/.ssh/config
# 安装hexo
- npm install -g hexo-cli
- npm install hexo-deployer-git --save
# 下载主题和插件
- git clone https://github.com/theme-next/hexo-theme-next themes/next
- git clone https://github.com/theme-next/theme-next-fancybox3 themes/next/source/lib/fancybox
- git clone https://github.com/theme-next/theme-next-jquery-lazyload themes/next/source/lib/jquery_lazyload
install:
- npm install
script:
- hexo generate
after_success:
- hexo deploy

每项配置的具体说明可以参考上面的文章，有十分详细的介绍。这里只说一下我遇到的小问题。

主题和插件

由于本网站使用了 next 主题，而且同步到 GitHub 的源码中不包含主题部分，因此需要同时下载该主题文件和开启的插件。需要注意的是路径要确保正确，否则生成的网页会无法加载所需的 js 脚本。

加密私钥

我使用的是 ed25519 算法生成的私钥，默认位于 ~/.ssh/id_ed25519，下面以此为例，可以根据自己的具体配置进行调整。

请确保当前所在目录名称和repo名称相同，否则 Travis 无法上传加密后的环境变量。

1
2
3
$ cp ~/.ssh/id_ed25519 .
$ travis encrypt-file id_25519 --add
$ rm id_ed25519

运行后会自动在 .travis.yml 添加以下内容

1
- openssl aes-256-cbc -K $encrypted_**********_key -iv $encrypted_**********_iv -in id_ed25519 -out id_ed25519 -d

对应的环境变量会自动上传到 Travis，可以在设置中进行查看。在集成时 Travis 会对加密文件进行解密，生成需要的私钥文件。

之后编辑一份 ssh 配置文件。

1
2
3
4
5
Host github.com
  User git
  StrictHostKeyChecking no
  IdentityFile ~/.ssh/id_ed25519
  IdentitiesOnly yes

至此全部配置结束，检查工作目录是否包含下面所有文件，特别是标记星号的文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
.
├── _config.yml*
├── db.json*
├── id_rsa.enc
├── node_modules
├── package.json*
├── scaffolds*
├── source*
│   ├── CNAME
│   ├── _posts
│   ├── categories
│   ├── img
│   └── tags
└── ssh_config*

然后就可以开心地上传到 GitHub 享受持续集成的快感了。可以去官网查看实时的 log 输出，排查问题。祝一次成功！

参考