使用hexo+github pages 搭建静态博客(从jekyll迁移到hexo)

笔者以前使用的 jekyll+github pages 的方式搭建博客, 后来从jekyll 迁移到了 hexo, 并不是说 jekyll 比 hexo 差.技术没有好坏, 只有合不合适, 我完全是自己折腾着玩儿. 在迁移的过程中也遇到一些问题, 下面就简要说明一下 hexo + github pages 的搭建步骤. 认真阅读原文, 你将能独立搭建一个静态博客.

我们分为两个步骤讲解然后讲解一下如何使用主题(next):

一, 使用hexo建站

二, 部署到 github pages

三, next 主题的使用

使用hexo建站

根据官方文档你可以很轻松的搭建一个静态博客网站.

几个hexo常用的命令:

hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)
hexo deploy #将.deploy目录部署到GitHub
hexo help  # 查看帮助
hexo version  #查看Hexo的版本

命令简写如下:

hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy
hexo g -d == hexo g + hexo d

部署到 github pages

部署到 github pages 也非常简单(后面会讲到), 再部署之前我们还有很多准备工作要做.

申请github账号.

申请步骤按照提示完成即可

新建仓库

ssh0.png

仓库名称有着严格的规范,如下:

自己的github账号名称.github.io

例如,我的github账号为 zhangsan, 那么仓库的命名<mark>一定是</mark>: zhangsan.github.io

配置SSH

首先我们普及一下 SSH和https的区别:

  1. SSH可以随意克隆github上的项目,而不管是谁的;而后者则是你必须是你要克隆的项目的拥有者或管理员,且需要先添加 SSH key ,否则无法克隆。
  1. https url 在push的时候是需要验证用户名和密码的;而 SSH 在push的时候,是不需要输入用户名的,如果配置SSH key的时候设置了密码,则需要输入密码的,否则直接是不需要输入密码的。
配置的SSH的方式

如下图:

ssh1.png

在左侧功能区选择SSH and GPG keys, 在右侧 点击 add new SSH 按钮.会出现如下图

ssh2.png

title: ssh的名称, 可以随便写.
key: 公钥.

如何生成公钥呢? 步骤如下:

1、首先需要检查你电脑是否已经有 SSH key

运行 git Bash 客户端,输入如下代码:

$ cd ~/.ssh
$ ls

这两个命令就是检查是否已经存在 id_rsa.pubid_dsa.pub文件,如果文件已经存在,那么你可以跳过步骤2,直接进入步骤3。

2、创建一个 SSH key

$ ssh-keygen -t rsa -C "your_email@example.com"

代码参数含义:

-t 指定密钥类型,默认是 rsa ,可以省略。
-C 设置注释文字,比如邮箱。
-f 指定密钥文件存储文件名。

3、添加你的 SSH key 到 github上面去

首先你需要拷贝 id_rsa.pub 文件的内容,你可以用编辑器打开文件复制,也可以使用终端打开, 这里就是用终端打开.

cat id_rsa.pub

终端会显示该公钥的密文, 赋值之后粘贴到上图中的key中即可.

4、测试一下该 SSH key

在git Bash 中输入以下代码

$ ssh -T git@github.com

如果出现如下信息则证明操作成功:

Hi xxx! You've successfully authenticated, but GitHub does not provide shell access.

至此第二步中添加 SSH 完成.下面开始将第一步建的站部署到github pages 上. 只需一步即可完工:

<mark>切换到hexo博客根目录, 运行hexo g -d即可</mark>

如何使用 next主题

终端切换到hexo博客根目录,然后执行如下命令:

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

然后在站点配置文件中做如下修改:

theme: next

然后重启 hexo 服务(先停止: ctrl + c, 然后运行 hexo s), 重新生成静态页面(hexo g)

hexo 的 next主题的配置, 在next官网上介绍的十分详细.

搭建博客过程中遇到的问题

一. 博客中的图片无法显示.

解决方式:
将图片资源全部存放在 source 目录下的 assets(自己建的文件夹)文件夹中. 在博客中使用md语法引用图片 [图片上传失败...(image-c2877-1562033829045)] 如果有下级目录, 按照目录结构写即可.

二. 按照next官网教程配置local_search无法搜索.

原因:发布的博文中有特殊字符(非utf-8字符集),主要是由于在直接复制网上资料时错误的将特殊字符复制进来了, 你可以将博文先全部删除, 只留一篇测试博文, 然后重新发布一下,试试搜索功能是否正常. 或者直接访问 http://localhost:4000/search.xml, 然后打开元素检查来查看具体的错误.(错误定位有可能不准确).

解决方法:找到特殊字符集, 然后删除

三. 如何在文章列表中显示摘要.

在 next主题中配置显示摘要, 配置如下, 但是不起作用.

auto_excerpt:
  enable: true
  length: 150

解决方法: 使用``来隔断摘要和正文, 在博文中之前的会被自动显示成摘要, 之后的要在点击read more之后才会显示

四. 写完博客之后, 发布但是不显示最新发布的博客

经过分析, 错误原因是博客开始的写法不对, 错误写法如下:

---
layout:post
title:"使用hexo+github pages 搭建静态博客(从jekyll迁移到hexo)"
date:2019-05-20 10:10:03
categories:
 - Skills
tags:
 - Hexo
---

以上写法是错误的, 在layout:post 冒号后要加空格, 正确的写法如下:

layout: post
title: "使用hexo+github pages 搭建静态博客(从jekyll迁移到hexo)"
date: 2019-05-20 10:10:03
categories:
 - Skills
tags:
 - Hexo
---
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,125评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,293评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,054评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,077评论 1 291
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,096评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,062评论 1 295
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,988评论 3 417
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,817评论 0 273
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,266评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,486评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,646评论 1 347
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,375评论 5 342
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,974评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,621评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,796评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,642评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,538评论 2 352

推荐阅读更多精彩内容