前言
在自己搭建网站的过程中,我翻阅了许多搭建 Hexo 博客的教程,居然没有一篇有好好讲一下在搭建完成之后,面对一个空荡荡的网站和一篇“Hello World”的英文文章我们该做些什么与能做些什么,而 Hexo 的官方文档又众所周知的莫名其妙——所以我整理了建站之后更新网站的基础操作,希望能对你有所帮助。
本篇开始前,应当已经完成的事情
- 可以通过网址访问网站
では、ゲームを始めましょう
新建文章 hexo new
对于 hexo 开头的命令均在 终端/cmd 当中, cd 到网站所在的文件夹中运行。例如在前面文档中举例使用的 Blog 本地资源库。
hexo new 指令可以简写为 hexo n,用来创建新文章。
简单操作
新建一个名称为“miao”的文章:
hexo n miao在目录 ~/Blog/source/_post 的文件夹中会出现一个名字为 miao.md 的文件,以及一个名字为 miao 的文件夹。这个 .md 文件是 markdown 语法的文档原件。
同名的文件夹用来存放在 .md 文件当中使用的图片等资源,没有这个文件夹也无伤大雅,嫌弃它占地方的话也可以手动删掉,用正确的 markdown 语法引用或者主题自带的标签插件来显示图片也是没问题的。
详细表述
新建项目的完整表述为:
hexo new [layout] <title><title>新建的文章标题 使用时不加<>- 空格需要使用
/或者" "处理,例如miao/ miao或者"miao miao"
- 空格需要使用
[layout]新建的类型,非必填项- 文章
post: 不填时默认的类型 - 分页
page: 新建网站的分页 - 草稿
draft: 草稿不会显示在发布的地方,未完成的文章可以先放在这里
- 文章
上面那个新建名字为“miao”的文章的完整表述就是以下的模样了
hexo new post miao替换文章 hexo -r
如果您想要新建一个同名的空白文档,可以使用 hexo -r 这个命令来替换文章:
# 将《miao miao》的文章替换为同名的空白文档hexo -r miao/ miao # 空格需要使用 /空格 的方式表述它命令的词源全称为 --replace。
[!TIP] 人工队再次获胜 同样的,可以直接在
Blog/source/_post手动搞掉这个文章,倒不如说这样子更方便。
撰写文章 Edit
在新建出来的 .md 文件里面直接修改就可以了
.md文件可以通过简单的符号处理生成好看的笔记与文章格式。如果您处理过 LaTex 文件,那么 markdown 语法上手会相当幼儿园。
我这辈子都不想再看到那个 LaTex 编辑器了。
Markdown 虽然说是一种语法和文件格式,但是实际上它的语法只有约定的渲染规则,而没有什么特殊的编码——这意味着任何一个 txt 文本都可以通过修改后缀名迅速变成一个 Markdown 文件。因此,可以编辑 Markdown 文件的编辑器也没有什么门槛。
页头 Front-matter
使用指令新建 Markdown 文件的开头,你会看见一个使用两个 --- 划分的区域,这个区域里面是这篇文章的基本属性设置,也叫做 front-matter。
最基本的 Hexo Front-matter 形式如下:
---title: Miao # 文档的标题date: 2020-08-22 13:01:18 # 文档创建的时间categories: # 文档的分类,通常会在“分类”的分页看见 - cattags: # 文档的标签 - miaomiaomiao---渲染器会根据每个文件开头的 Front-matter 将文章自动打上相对应的标签与分类,并且读取到文档的标题和发布时间。
需要注意的是,在不同的主题和插件当中,对 Front-matter 还有不同的设定。比如封面图片、评论功能、置顶等等,其语法和基本语法大同小异,一看就懂,不再赘述。
默认categories属性的一些知识点
Hexo 的分类和其他博客框架的逻辑稍微有所不同,它不会创建平行分类,而是产生子分类:
---categories: - miao - miaomaio---入上例,miaomiao 为 miao 的子分类,类似于 miao = 猫,miaomaio = 布偶猫的样子。
相对来说,tags 则是平行分类,一篇文章被允许脚踩很多条 tags 船
这是个具体的例子
---title: 关于梨可可应该不是猫咪的研究date: 2020-08-22 13:01:18categories: - research - cattags: - miao - white - 梨可可---这篇文档是 research 大类中 cat 的小分类,同时具有 miao、white、梨可可三个标签。
以上规则会根据主题不同有所改变,比如说产生平行分类,还请仔细阅读主题文档。
:::
本地预览 hexo s
在本地服务器上预览网页
在进行网站更改之后,我们在上传更新之前或许需要提前预览一下,尤其是在部署到正式服务器上时更需如此,它可以帮我们消除 bug 并节省经费。
hexo s 命令可以将目前保存的网站更新至本地服务器进行预览,全称为 hexo server。
在 终端/cmd 当中,Blog 路径下:
hexo s在进行该命令之后,你可以在命令窗口看见这样的提示:
INFO Validating configINFO Start processingINFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.这时候,按住 command(ctrl) 单击链接,就可以在默认浏览器中预览已经搭建好的网页了。
预览并不会被部署到云端,它是只有你自己可以看见的一个本地预览,使用的是本地仓库中构建的内容。灵活使用本地预览来确定自己的网站的实际观感,在最终确定之后再进行发布上传。
清除冗杂数据
预览网页的时候,Hexo 会将 .md 文本渲染为 html 静态网页,这个过程中会产生缓存数据:
- 缓存文件
db.json等。 - 生成的静态文件
public文件夹中。
我们可以通过下面这个代码清除缓存数据:
hexo clean经常清理冗杂数据可以解放本地文件存储,可以至少在心理层面加快 Hexo 命令和本地计算机的运行速度。
构建与部署发布网站 hexo g -d
此时,你已经完成了一篇文章的写作,它有这样的固有属性:
- 存放于
/_posts。 - 文件后缀名为
.md。
接下来,需要做的是构建和发布网站,让使用其他设备的人也能访问到公开的内容。
构建网站
构建网站,就是用前面编辑的一大堆素材生成静态网页。指令为 generate,它也可以简写为 g:
hexo g生成静态文件并且没有报错之后,我们就可以部署网站了。
部署网站
部署网站的命令为 deploy,它也可以简写为 d:
hexo d我们可以将两个命令合起来写,一次部署顺手发布,这样会方便很多:
hexo g -d # 写成 d -g 也是允许的
hexo s本地部署指令会同时包含这两个指令并在本地发布,所以不需要分布执行。
网站就更新成功了。
☆YA☆DA☆ZE☆
结束语
以上就是网站文章更新的全部流程,我在进行流程描述的同时,也加入了一些关于 Hexo 基本框架的简单解释~~,方便大家进行邪门操作~~。
当然,这个流程也许会漏洞百出,但是它既没有报错也没有 bug 又能更新网站……
能用就行。
关于如何美化自己的Hexo并且给它安装插件和主题的简要说明参考下一章。
分享文章
生成精美分享图或复制链接,与更多人分享本文。