把博客完全迁移到 GitHub，开启懒人之旅

· 284 words · 2 minute read
Legacy

这是一篇从前博客迁移来的文章。

categories: 搞博客
tags: 
-  "Travis CI"
- GitHub
- 部署
- 服务器
- 博客

------

我的 Hexo 博客一直是放在自己的 VPS 进行部署的，自己配置 Nginx 等。每次写完文章还需要 SFTP 上传、登录 ssh、hexo  g、hexo d，非常麻烦。而且还没办法用版本控制，享受不到 revert 等功能。这段时间，我把博客部署到了 GitHub，并使用 Travis CI 自动部署，每次写文章只需要 Push 到 GitHub 即可自动更新，非常省事。再一个，如果万一哪天 VPS GG 了，.....

# 迁移到 GitHub Pages
由于是静态页面，首先是抛弃 Nginx，把博客托管到 GitHub Pages，我们使用hexo自带插件`hexo-deployer-git`。

## 安装配置插件

cd 到博客根目录，执行：
```shell
npm install hexo-deployer-git --save

之后就安装完成了，接下来进行配置。

首先，自觉建一个Repo。 然后打开hexo的_config.yml（就是博客根目录那个），最底下加入内容：

deploy:
  type: git
  repo: Repo地址，比如说https://github.com/Trumeet/Blooooooog.git
  branch: 分支，我建议用 gh-pages
  message: 每次提交的Message，自己瞎写即可

保存。下次执行 hexo d 的时候就会问你要 git 用户名密码 自动Push了。

配置 CNAME 及解析 #

如果你需要使用自己的域名，则需要在 GitHub Pages分支 添加一个 CNAME 文件，里面写你的域名。（自己 Repo Settings 里面的 Custom Domain 也是做的这个操作）

但是，由于每次自动deploy会抹掉gh-pages的内容，所以我们没办法在那个分支创建CNAME。不过别急，我们可以把这个CNAME放在博客的source目录，它就会被deployer自动上传了。

配置解析，直接在Cloudflare的DNS页面把以前的A记录IP改为192.30.252.153即可，TTL为Automatic。之后会出现一段时间证书问题，一会儿会自己解决，不用管它。

至此，我们的博客已经托管到 GitHub Pages 了。

把源文件转移到 GitHub #

刚才，我们只是废弃了 Nginx，由 GitHub 帮助我们托管页面。但是博客的源配置和文章Markdown还在自己这，有什么卵用呢，所以我们需要将源文件放到 GitHub。

去除主题 Submodule #

我使用 hexo-theme-material 主题，从 GitHub 下下来放进 themes 文件夹，它还带有 .git 文件夹，说明是 submodule，无法添加到git。

所以，在 git init 之前，我们先把它的.git去掉即可（大概？我没这么做） 如果你之前已经创建了，那么稍麻烦点，先干掉主题目录的 .git 文件夹，然后执行：

git rm --cached （主题目录）

添加主题配置 #

去主题目录的 .gitignore 去除 _config.yml 忽略，随后即可添加。

注意！如果你的主题配置有Key之类的内容，建议做法是使用Travis CI+sed命令+环境变量保护。但我这里没有这是，而是通过服务商那里域名验证实现的。如果需要保护，请自行研究！

上传源文件 #

照常添加文件、提交、Push到master（非Pages分支）即可，不再阐述。

至此，我们已完全脱离服务器。每次要更新博客，只需要找台电脑，配置npm和node环境，pull master，再生成并deploy即可了。但是还是觉得麻烦（划掉

Travis CI 全自动配置 #

我们还是觉得麻烦，还想再犯懒。所以就需要大杀器——Travis CI。它会在每次master变动（Push后）自动安装依赖、生成并deploy，岂不是美滋滋（跑

创建 GitHub token #

需要先创建一个 personal access token，这样 Travis CI 才可以无需密码访问你的信息。

先要去 GitHub / Settings / Developer settings / Personal access tokens 页面。

然后点击 “Generate new token” 按钮创建 token。

填写信息：

  • Token description是名称，随便写。 下面勾选：
  • repo:status
  • repo_deployment
  • public_repo
  • repo:invite
  • user:email

随后生成即可，创建后，token只显示一次，赶快拿小本本抄下来~~，截屏留念~~。

绑定 Travis CI #

这步会让 Travis CI 链接到你的Repo。先去 Travis CI 官网 https://travis-ci.org/ 授权 GitHub 账号。然后在Repo列表把你的博客Repo打开开关。再点进那个Repo的设置，勾选 Build only if .travis.yml is present，Build branch updates。不勾 Limit concurrent jobs和Build pull request updates。

配置环境变量 #

在 Travis CI 设置页，找到 Environment Variables。新建一个名为 GH_TOKEN 的变量，值为刚才的 Token。其他变量也可以在这里设置。项目构建的日志是公开的，但是这些变量的值会显示为 secure，这就是变量的好处。

创建配置文件 #

最后一步，在你的项目的 master（放置源文件的分支）创建 .travis.yml。 内容：（主要参考 https://skychang.github.io/2017/01/01/Hexo-Use_Travis_CI_Auto_Deploy_Blog）

language:  node_js
node_js:  stable
script:
  -  npm  install
  -  hexo  cl
after_success:
  -  git  config  --global  user.name  "你 git 配置的用户名" 
  -  git  config  --global  user.email  "你 git 配置的邮箱"
  -  sed  -i''  "/^ *repo/s~github\.com~${GH_TOKEN}@github.com~"  _config.yml
  -  hexo  deploy  -g

之后，打开 Travis CI 项目页，就可以看到自动部署了！至此，我们的博客完全迁移到 GitHub，而且每次写博客的时候完全可以用 GitHub 网页版上传文件，剩下的事就不需要你管了。