目录

GitHub Pages是什么?

GitHub Pages本用于介绍托管在GitHub的项目, 不过,由于它具有300MB免费空间,而且十分稳定(也许以后会被墙),所以用来做搭建一个博客再好不过了。
GitHub Pages的官网:https://pages.github.com/

配置环境

1. 需要安装的软件

安装这些软件也是有技巧的,因为如果你普通去官网上下会非常慢的,除非你人品好(别问我为什么)

所以说这里推荐几个VPN,挂上VPN下载的可以快一些

  • EVO加速器(每个月有1GB的流量,有日本和美国线路,比较稳定)
  • 赛风(多平台客户端,速度较慢)
  • Lantern(google的项目)

2.注册与配置GitHub

  • 打开https://github.com/ (记好你注册时的UserName和E-mail)
  • 进入你的个人页面,点击Repositories,再点击绿色的New

使用Github和Hexo搭建自己的博客

  • 将Repositories命名为username.github.io(username替换成你自己的)

使用Github和Hexo搭建自己的博客

3.配置Hexo

新建一个放置你博客的目录,在此处右键,点击Git Bash Here

使用Github和Hexo搭建自己的博客

安装Hexo

$ npm install -g hexo

部署Hexo

$ hexo init

Hexo随后会自动在目标文件夹建立网站所需要的所有文件(现在目录大概看起来是这个样子的)

使用Github和Hexo搭建自己的博客

查看本地Hexo

现在我们已经搭建起本地的hexo博客了,执行以下命令,然后到浏览器输入localhost:4000就可以查看了

$ hexo generate ($ hexo g 也可以)
$ hexo server ($ hexo s 也可以)

使用Github和Hexo搭建自己的博客

关联GitHub

将博客目录中的_config.yml中最下面的deploy改为下面的样子

使用Github和Hexo搭建自己的博客

deploy:
  type: git
  repo: https://github.com/leopardpan/leopardpan.github.io.git
  branch: master

注意:冒号后面有一个空格

网上会有很多说法,有的type是github, 还有repository最后面的后缀也不一样,是github.com.git,我也踩了很多坑,不过现在按照上面那个是对的

执行以下命令

$ npm install hexo-deployer-git --save

完成

执行以下命令来上传

$ hexo generate ($ hexo g 也可以)
$ hexo deploy ($ hexo s 也可以)

或者可以一步到位

$ hexo d -g

使用Github和Hexo搭建自己的博客

使用Github和Hexo搭建自己的博客

如果上面的过程没错,你现在可以通过https://username.github.io/ (将username换成你的用户名)来访问你的博客了,如果遇到问题,请继续往下看

问题与错误

1. _config.yml错误

部署的时候会提示“致命错误”,多数情况是因为

冒号后面要加空格

冒号后面要加空格

冒号后面要加空格

重要的事情说三遍!!!

2.部署成功,但是....404

我第一次安装的时候执行过 hexo d -g 后提示 INFO Deploy done: git,我高兴了好一阵

然后打开页面时就404了,我发现它居然把整个hexo根目录给提交了上去。

查了很多网站,后来发现是因为我之前执行过git init

解决方法:在hexo根目录下删除“.git”文件夹(可能是隐藏的)。

3.部署成功,但是内容没有更新

解决方法:输入以下命令

$ hexo clean
$ hexo d -g

4.部署错误

错误信息1

FATAL Something's wrong. Maybe you can find the solution here: Troubleshooting**
Error: fatal: Not a git repository (or any of the parent directories): .git

解决方法:删掉根目录下的文件夹:.deploy_git,重新deploy就可以了。

错误信息2

Error: spawn git ENOENT

解决方法:添加Git与Git管理库的环境变量

D:\Git\bin;D:\Git\libexec\git-core

错误信息3

ERROR Deployer not found: git 或者 ERROR Deployer not found: github

解决方法:输入以下命令

npm install hexo-deployer-git --save

5.测试错误

这个我没出现过,别的论坛看到的,希望能对你有帮助
错误信息:

ERROR Plugin load failed: hexo-server

解决方法: 输入以下命令

npm install hexo-server

购买域名

注意:这个步骤不是必须的,你可以选择购买域名(收费),也可以选择使用GitHub Pages的二级域名(免费)

因为我没有购买域名(当然以后会的),所以先不写这里

主题的部署

Hexo的主题有很多,可以自己选择

有哪些好看的 Hexo 主题?

我这里已部署NexT主题为例

1.找到主题的GitHub页面

https://github.com/iissnan/hexo-theme-next

使用Github和Hexo搭建自己的博客

2.选择右上方绿色的Clone or download中的Download ZIP

3.将下载好的文件解压,并放入博客根目录的themes文件夹中

4.修改根目录的_config.yml(站点配置文件)

找到 theme 字段,并将其值更改为 next

使用Github和Hexo搭建自己的博客

5.修改主题目录的_config.yml(主题配置文件)进行个性化设置

开始使用

主题配置

第三方服务

内建标签

进阶设定

Markdown简明使用方法

编辑器

Markdown在很多平台上都有编辑器

Mac 推荐 Mou 与 Ulysses Ⅲ

Windows 推荐 Typora、MarkPad、MarkdownPad

Android 推荐 MarkdownX

iOS 推荐 Drafts、Day One、iA Writer

Web 推荐 简书

标题

一级标题

二级标题

三级标题

四级标题

五级标题
六级标题
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

列表

  • 无序列表
  • 无序列表
  1. 有序列表
  2. 有序列表
* 无序列表
* 无序列表
1. 有序列表
2. 有序列表

引用

这是个引用

> 这是个引用

图片与链接

插入图片

![图片的描述](图片的地址)

插入链接

[链接的描述](链接的地址)

粗体与斜体

这是个粗体

**这是个粗体**

这是个斜体

*这是个斜体*

表格

TablesAreCool
col 3 isright-aligned$1600
col 2 iscentered$12
zebra stripesare neat$1
| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned | $1600 |
| col 2 is      | centered      |   $12 |
| zebra stripes | are neat      |    $1 |

代码框

代码

`代码`
好多代码
好多代码

分隔线


***

参考资料

[1]简明Github Pages与Hexo教程

[2]Hexo部署至Git遇到的坑

[3]Hexo+Github,搭建属于自己的博客

[4][Hexo deploy失败?

©著作权归作者所有

发表评论