Hexo+GitLab新手向流程

在经过了GitHub(不支持百度抓取),Coding(国外月亮圆系列)的折腾后终究还是把目标锁定在了GitLab上,其云端生成页面,自定义证书等特性深深的吸引了我.然而,Google+Bing搜索下来新手向教程寥寥无几,索性自建一个便于日后的学习以及分享自己的经验让新人少走弯路,本系列流程的目的是以尽量通俗的语言、直观地描述来引导新手小白成功的搭建属于自己的博客

GitLab


由于本人并非相关专业从事者,教程仅供参考,本教程具有时效性如有版本变更请仔细阅读官方文档


选用GitLab的缘由:

GitHub存在的问题

  1. 不能被百度爬虫爬取
  2. 须本地生成静态网页后部署,较为麻烦,不方便多机管理
  3. 设置Custom Domain后不能开启HTTPS (经过交流已解决,为证书申请相关问题)
  4. 对于新手来说英文界面不太友好

Coding存在的问题

  1. 百度玄学不能爬取(经搜索可能是因为Coding加入了跳转页面)
  2. 既然也不能爬取那就不如用GitHub了 =_=
  3. 对 BAT 家的东西有偏见

GitLab的优点

  1. 可被百度爬取内容
  2. 在GitLab服务器完成生成静态网页以及部署过程,方便管理,可以在线编辑md文档后直接部署(旅游党最爱)
  3. 可以将语言调整为中文(个人仍然习惯英文)

一把钥匙N把锁(误


搭建流程:

配置环境及安装Hexo(Win10 64)

安装 Git & Node.js

Git以及Node.js官方下载安装即可,注意选择自己对应的系统及版本

安装Hexo

本地新建文件夹如"Hexo",打开该文件夹右键选择Git bash here,依次输入以下指令

每次仅可输入一个指令


$ npm install hexo-cli -g #安装hexo命令行
$ hexo init #下载hexo初始代码
$ hexo install #安装依赖
$ hexo s #启动本地服务,预览页面

如以上操作无误,在浏览器打开http://localhost:4000/ 即可看见Hexo初始界面


将Hexo部署到Gitlab Pages

创建GitLab Page

注册Gitlab账号(不用教了吧),右上角点击你的头像,打开Settings->Preferences->Localization->Language选为你所需要的语言即可

为了方便大多数人本文选项名称一律以中文书写

  1. 从右上方向左看你会看到一个加号,点击它,选择新建项目,选择Blank project,项目名称设置为username.gitlab.io(username为你的GitLab账户名),Visibility Level选项选为私有,不选Initialize repository with a README
  2. 点击你的头像,点击设置,点击SSH密钥,在页面即可看到生成一个现有的key,根据自己的情况选择后将key粘贴到相应位置并命名密钥,点击保存密钥即可

添加.gitlab-ci.yml文件

Hexo目录下新建添加.gitlab-ci.yml,

修改主题配置&部署Gitlab Page

以下以 Next 主题为例

Hexo目录下运行git bash


$ cd your-hexo-site
$ git clone https://github.com/theme-next/hexo-theme-next themes/next

打开~/Hexo/themes/next目录删除.git文件夹(否则会报错)
进入站点配置文件,搜索themes,将其值改为next


$ git init
$ git remote add origin [email protected]:username/username.gitlab.io.git
$ git add .
$ git commit -m "init blog"
$ git push -u origin master

第二句命令请根据自己的项目名称进行调整
完成推送后在项目里点击CI/CD查看,显示已通过即可由https://username.gitlab.io/访问你的博客

Gitlab Pages 绑定个人域名

修改_config.yml文件中的url地址为https://yourdomain,重新提交,部署完成后,在项目页面访问设置->Pages->New Domain,输入你自己的域名以及证书密钥并设置DNS CNAME解析到你的Pages即可使用你的域名访问博客(建议打开Force HTTPS并申请证书使用HTTPS访问)