如何使用 Jekyll + github 搭建博客

p 收录于 Tutorial

2018-01-12 约 1641 字预计阅读 4 分钟

之前用的是WordPress，懒癌患者，也没怎么写文章，前几天主机到期了，于是用了Jekyll+github，之前的数据都基本丢了。

创建GitHub Pages

注册GitHub

没有账号的先到官网注册

自建仓库

在GitHub首页选择Start a project

Repository name格式为：xxx.github.io（xxx是你自定义的名称）

不要勾选Initialize this repository with a README

点Creating repository完成创建

创建成功后显示出下图

Fork仓库

找到你想Fork博客的GitHub仓库，点击右上角的Fork，再到你自己的项目里就可以看到了

先进入设置把仓库名字改一下，其他对应的配置按自己的要求进行修改即可

安装本地Git环境

安装git

首先下载 git for windows

不懂的可以直接按默认设置安装，安装完成后打开Git Bash（如果按默认安装的，桌面、鼠标右键、开始菜单里应该都有）

在打开的命令行窗口（Shell）内执行以下命令，设置你的git用户名和邮箱：

1
2
git config --global user.name "xxx"  // 设置你的git用户名
git config --global user.email "xxx@xxx.com"  // 设置你的git邮箱

配置SSH

在之前打开的Shell内执行：

1
ssh-keygen -t rsa -C "xxx@xxx.com"   // 获取SSH加密设置，xxx@xxx.com为你的邮箱

直接按回车一直到命令完成，然后打开你电脑当前的用户目录下打开 .ssh 文件夹，里面有两个文件 id_rsa 是私钥，需要保密， id_rsa.pub 是公钥，无需保密，接着打开 id_rsa.pub 将里面的内容复制下来

在网页打开你github账号的设置

选择SSH and GPG key选项下的New SSH key，将复制的内容粘贴在key选项框里保存即可

克隆远程仓库到本地

找到你想Fork博客的GitHub仓库点击 Clone or download 复制列表框里的链接备用

打开Git Bash，输入以下命令将位置切换到你想放置本地代码的地方

1
cd {本地路径}      // 比如：cd d:/blog

克隆你想要的远程仓库：

1
git clone {上面复制的仓库地址}     // 比如：https://github.com/Huxpro/huxblog-boilerplate.git

成功后打开{本地路径} 即可看到你clone的文件

部署Jekyll本地编译环境

该步骤是自己第一次部署的时候遇到的大坑，很多教程都没有讲的很清楚，而且在windows上部署很不友好，这也是很多人选择Hexo的原因

安装Ruby

1.安装Ruby

~~ps：请选择Ruby 2.0至2.3版本，不建议安装Ruby2.4及以上新版本，大坑所在，无以言表。~~

2.安装对应版本的DevKit

DevKit解压完之后进windows的cmd终端在DevKit目录下运行命令：

1
2
ruby dk.rb init
ruby dk.rb install

安装RubyGems

下载 RubyGems

下好后解压到本地路径，打开cmd终端输入：

1
2
cd {本地路径}  //例如 cd c:\rubygems
ruby setup.rb

接着输入：

1
gem -v

有返回版本号即安装成功

安装Jekyll

输入命令：

1
gem install jekyll

如果安装失败需要更换RubyGems为Ruby China源

1
2
gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/
gem sources -l

请确保返回值只有 gems.ruby-china.org

如果提示ssl证书错误请将https://gems.ruby-china.com里的 https 改成 http 再试

安装jekyll-paginate

输入命令：

1
gem install jekyll-paginate

安装wdm Gem

输入命令：

1
gem install wdm

开启本地预览

输入命令：

1
2
cd {本地仓库路径} // 例如：cd d:\blog
jekyll serve

在浏览器地址栏输入既可预览 http://localhost:4000/

将本地jekyll代码部署到Github仓库

发布到github

打开Git Bash

1
2
3
4
5
6
cd d:\blog
git init
git add .
git commit -a -m  "statement"    //此处statement填写此次提交修改的内容，作为日后查阅
git remote add origin {远程仓库路径}    //比如：git remote add origin https://github.com/用户名/仓库名称.github.io.git
git push -u origin master

更新到github

1
2
3
git add .
git commit -m "statement"    //此处statement填写此次提交修改的内容，作为日后查阅
git push origin master

撤销上一次commit

1
2
git reset --hard HEAD~1
git push --force

参考文章

[1]. Bebop.C的博客 — Github Pages + Jekyll 独立博客一小时快速搭建&上线指南

[2]. 知乎 — windows10下用gem安装jekyll失败,怎么办?（已解决）

[3]. github官方文档 — 使用Jekyll作为静态网站生成器与GitHub页面