2302 字
12 分钟
Hexo_3 - 建站之后,更新网页的方法

前言#

在自己搭建网站的过程中,我翻阅了许多搭建 Hexo 博客的教程,居然没有一篇有好好讲一下在搭建完成之后,面对一个空荡荡的网站和一篇“Hello World”的英文文章我们该做些什么与能做些什么,而 Hexo 的官方文档又众所周知的莫名其妙——所以我整理了建站之后更新网站的基础操作,希望能对你有所帮助。

本篇开始前,应当已经完成的事情
  • 可以通过网址访问网站

では、ゲームを始めましょう

新建文章 hexo new#

对于 hexo 开头的命令均在 终端/cmd 当中, cd 到网站所在的文件夹中运行。例如在前面文档中举例使用的 Blog 本地资源库。

hexo new 指令可以简写为 hexo n,用来创建新文章。

简单操作#

新建一个名称为“miao”的文章:

Terminal window
hexo n miao

在目录 ~/Blog/source/_post 的文件夹中会出现一个名字为 miao.md 的文件,以及一个名字为 miao 的文件夹。这个 .md 文件是 markdown 语法的文档原件。

同名的文件夹用来存放在 .md 文件当中使用的图片等资源,没有这个文件夹也无伤大雅,嫌弃它占地方的话也可以手动删掉,用正确的 markdown 语法引用或者主题自带的标签插件来显示图片也是没问题的。

详细表述#

新建项目的完整表述为:

Terminal window
hexo new [layout] <title>
  • <title> 新建的文章标题 使用时不加<>
    • 空格需要使用 / 或者 " " 处理,例如 miao/ miao 或者 "miao miao"
  • [layout] 新建的类型,非必填项
    • 文章 post: 不填时默认的类型
    • 分页 page: 新建网站的分页
    • 草稿 draft: 草稿不会显示在发布的地方,未完成的文章可以先放在这里

上面那个新建名字为“miao”的文章的完整表述就是以下的模样了

Terminal window
hexo new post miao

替换文章 hexo -r#

如果您想要新建一个同名的空白文档,可以使用 hexo -r 这个命令来替换文章:

Terminal window
# 将《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: # 文档的分类,通常会在“分类”的分页看见
- cat
tags: # 文档的标签
- miaomiaomiao
---

渲染器会根据每个文件开头的 Front-matter 将文章自动打上相对应的标签与分类,并且读取到文档的标题和发布时间。

需要注意的是,在不同的主题和插件当中,对 Front-matter 还有不同的设定。比如封面图片、评论功能、置顶等等,其语法和基本语法大同小异,一看就懂,不再赘述。

默认categories属性的一些知识点

Hexo 的分类和其他博客框架的逻辑稍微有所不同,它不会创建平行分类,而是产生子分类:

---
categories:
- miao
- miaomaio
---

入上例,miaomiao 为 miao 的子分类,类似于 miao = 猫,miaomaio = 布偶猫的样子。

相对来说,tags 则是平行分类,一篇文章被允许脚踩很多条 tags 船

这是个具体的例子
---
title: 关于梨可可应该不是猫咪的研究
date: 2020-08-22 13:01:18
categories:
- research
- cat
tags:
- miao
- white
- 梨可可
---

这篇文档是 research 大类中 cat 的小分类,同时具有 miao、white、梨可可三个标签。

以上规则会根据主题不同有所改变,比如说产生平行分类,还请仔细阅读主题文档。

:::

本地预览 hexo s#

在本地服务器上预览网页#

在进行网站更改之后,我们在上传更新之前或许需要提前预览一下,尤其是在部署到正式服务器上时更需如此,它可以帮我们消除 bug 并节省经费。

hexo s 命令可以将目前保存的网站更新至本地服务器进行预览,全称为 hexo server。

在 终端/cmd 当中,Blog 路径下:

Terminal window
hexo s

在进行该命令之后,你可以在命令窗口看见这样的提示:

Terminal window
INFO Validating config
INFO Start processing
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

这时候,按住 command(ctrl) 单击链接,就可以在默认浏览器中预览已经搭建好的网页了。

预览并不会被部署到云端,它是只有你自己可以看见的一个本地预览,使用的是本地仓库中构建的内容。灵活使用本地预览来确定自己的网站的实际观感,在最终确定之后再进行发布上传。

清除冗杂数据#

预览网页的时候,Hexo 会将 .md 文本渲染为 html 静态网页,这个过程中会产生缓存数据:

  • 缓存文件 db.json 等。
  • 生成的静态文件 public 文件夹中。

我们可以通过下面这个代码清除缓存数据:

Terminal window
hexo clean

经常清理冗杂数据可以解放本地文件存储,可以至少在心理层面加快 Hexo 命令和本地计算机的运行速度。

构建与部署发布网站 hexo g -d#

此时,你已经完成了一篇文章的写作,它有这样的固有属性:

  • 存放于 /_posts。
  • 文件后缀名为 .md。

接下来,需要做的是构建和发布网站,让使用其他设备的人也能访问到公开的内容。

构建网站#

构建网站,就是用前面编辑的一大堆素材生成静态网页。指令为 generate,它也可以简写为 g:

Terminal window
hexo g

生成静态文件并且没有报错之后,我们就可以部署网站了。

部署网站#

部署网站的命令为 deploy,它也可以简写为 d:

Terminal window
hexo d

我们可以将两个命令合起来写,一次部署顺手发布,这样会方便很多:

Terminal window
hexo g -d # 写成 d -g 也是允许的

hexo s 本地部署指令会同时包含这两个指令并在本地发布,所以不需要分布执行。

网站就更新成功了。

☆YA☆DA☆ZE☆

结束语#

以上就是网站文章更新的全部流程,我在进行流程描述的同时,也加入了一些关于 Hexo 基本框架的简单解释~~,方便大家进行邪门操作~~。

当然,这个流程也许会漏洞百出,但是它既没有报错也没有 bug 又能更新网站……

能用就行。

关于如何美化自己的Hexo并且给它安装插件和主题的简要说明参考下一章。

Hexo_3 - 建站之后,更新网页的方法
https://lyrikp.art/knowledge-cluster/Hexo/Hexo-3/
作者
L1key
发布于
2020-08-27
许可协议
CC BY-NC-SA 4.0

分享文章

生成精美分享图或复制链接,与更多人分享本文。