搭建基于 Travis CI 自动化部署的 Hexo/Next 主题博客

Hexo 是一个快速、简单且强大的静态博客框架，而 Next 则是一款流行的 Hexo 主题。本文将介绍如何使用 Travis CI 实现 Hexo 博客的自动化部署，并且使用 Next 主题进行美化。

准备工作

注册 Travis CI 账户并与 GitHub 关联；
配置 SSH 密钥，详情可参考这里。

安装 Hexo

在本地安装 Hexo 并创建一个新的博客：

--- ------- -------- --
---- ---- ----
-- ----
--- -------

创建 GitHub 仓库

创建一个空的 GitHub 仓库，并将其与本地博客目录关联：

--- ------ --- ------ ----------------------------------------------------

配置 Travis CI

在博客目录下创建一个 .travis.yml 文件，并添加以下内容：

--------- -------
--------
  - -------

--------
  - --- -------

-------
  - ---- --------

--------------
  - ---- ---------

这里使用了 lts/* 的 Node.js 版本，你也可以选择其他版本。install 和 script 命令分别用于安装依赖和生成静态文件，after_success 命令则用于在构建成功后执行自定义脚本。

创建 deploy.sh 文件，并添加以下内容：

-----------

- -- --- --
---- ---------------- - -- -- ---- - -------------
----- --- -------------

- -- ---
--- ------ -------- ---------- --------------
--- ------ -------- --------- -----------------

- --- ------ -----
-- ------
--- ----
--- --- -
--- ------ -- ------- -- ------ ------
--- ---- ------- ------- ---------------------------------------------------------------------- ---------------

这里使用了 Travis CI 的环境变量 $SSH_PRIVATE_KEY 和 $GH_TOKEN，前者用于配置 SSH 密钥，后者用于身份验证并推送到 GitHub。

最后，在 Travis CI 上启用对该仓库的构建选项即可。

配置 Next 主题

在博客目录下安装 Next 主题：

--- ----- --------------------------------------------- -----------

然后在 _config.yml 文件中设置主题为 next。

------ ----

此时通过 hexo generate 命令生成的静态文件已经包含了 Next 主题的样式和模板。

发布博客

现在只需将新文章写在 source/_posts 目录下，并将代码提交到 GitHub，Travis CI 就会自动部署博客到 gh-pages 分支上。访问 <YOUR_USERNAME>.github.io/<YOUR_REPOSITORY> 即可预览博客。

结语

本文介绍了如何使用 Travis CI 实现 Hexo 博客的自动化部署，并使用 Next 主题进行美化。通过这个过程，我们也学习了一些基本的 Git 和 SSH 知识。希望这篇文章能够对想要搭建自己博客的前端开发者有所帮助。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/31463

搭建基于Travis CI自动化部署的hexo／next主题博客