Hexo 基本操作（二）

2.Hexo 基本操作

2.1 写作

1. 创建新文章或页面

1
hexo new [layout] <标题>

2. 三种默认布局（Layout）

布局 保存路径 用途
post source/_posts 正式文章（最常用）
page source 独立页面（如“关于我”）
draft source/_drafts 草稿（默认不发布）

修改默认布局：在 _config.yml 中更改 default_layout 的值。

3. 模板（Scaffolds）

当你执行 hexo new 时，Hexo 会在 scaffolds 文件夹中查找与布局同名的模板文件，并用它生成新文章的内容。

自定义模板：你可以创建新的模板文件，例如 scaffolds/photo.md，然后执行 hexo new photo "我的相册"，Hexo 就会使用 photo.md 作为模板。

模板中可用的变量：

变量 说明
layout 布局名称
title 文章标题
date 文件创建日期（自动填充）

2.2 Front-matter

1. Front-matter 是什么

Front-matter 是 Markdown 文件开头的一段配置信息，用 YAML 或 JSON 格式书写，用于设置文章的独立参数（如标题、日期、布局、标签等）。
Hexo 在渲染文章时会读取这些配置。

2. 书写格式

  • YAML 格式：用三个短横线 --- 包裹代码块，每行以 键: 值 形式书写。

    1
    2
    3
    4
    ---
    title: Hello World
    date: 2026-01-01 20:46:25
    ---

3. 常用设置项及默认值

设置项 作用 默认值
layout 指定该文章使用的布局 post
title 文章标题 文件名（不含扩展名）
date 文章创建日期 文件本身的创建时间
updated 文章更新日期 文件最后修改时间
comments 是否允许评论（主题支持时生效） true
tags 文章标签（仅适用于 post 布局，不适用于 page） 无
categories 文章分类（仅适用于 post 布局，支持层次结构） 无
permalink 覆盖默认的永久链接，需以 / 或 .html 结尾 null
excerpt 纯文本形式的手动摘要（可配合插件格式化） 无
disableNunjucks 是否禁用 Nunjucks 模板标签（如 {{ }}、{% %}）及标签插件 false
lang 文章语言，覆盖自动检测的语言 继承自 _config.yml 的 language
published 文章是否发布。对于 _posts 下文章默认为 true；对于 _drafts 下文章默认为 false 见描述

4. 分类与标签的写法（重点）

适用范围：仅 post 布局支持分类和标签。page 和 draft 通常不使用。

4.1 标签（Tags）

标签是扁平列表，顺序无关紧要。

1
2
3
4
tags:
  - JavaScript
  - Hexo
  - 教程

4.2 分类（Categories）

分类可以被组织成层次结构。有两种写法：

1.单一分类链（单个层级的父子关系）

1
2
3
categories:
  - Sports
  - Baseball

这表示文章属于 Sports 大分类下的 Baseball 子分类。生成的分类路径为 Sports/Baseball。

2.多个分类层次（独立多维分类）

若需要用列表包裹列表，可以定义多个并列的层级树。

1
2
3
4
5
categories:
  - [Sports, Baseball]                      # 分类树1：Sports -> Baseball
  - [MLB, American League, Boston Red Sox]  # 分类树2：MLB -> American League -> Boston Red Sox
  - [MLB, American League, New York Yankees] # 分类树3：MLB -> American League -> New York Yankees
  - Rivalries                               # 分类树4：单独的一级分类 Rivalries

上述配置表示：

  • 文章同时属于四个分类体系。
  • 每个 [ ] 内定义了该体系下的完整父子顺序（从父到子）。
  • 单个字符串（如 Rivalries）表示只有一级分类，没有子分类。

重要：如果你希望文章属于多个相互独立的一级分类，请使用上述数组嵌套形式，而不是简单列出两个一级名称——简单列出会被解释为父子关系。

4.3 分类顺序的影响

  • 在 YAML 中，categories 数组的顺序决定了层次结构的先后。例如 [A, B, C] 表示 A > B > C。
  • 不同分类链之间互不影响，文章会出现在每个链对应的分类页面中。

2.3 资源文件夹

1. 资源文件夹的概念

资源（Asset）是指 source 文件夹中除文章外的所有文件，例如图片、CSS、JS 文件等。Hexo 提供两种方式来管理这些资源：全局资源文件夹 和 文章资源文件夹。

2. 全局资源文件夹（简单方式）

适用场景：整个网站只有少量图片等资源，不需要按文章分别管理。

做法：

  1. 在 source 文件夹下新建一个目录，例如 images。

  2. 将图片等资源放入该目录（如 source/images/my-photo.jpg）。

  3. 在 Markdown 文章中使用绝对路径引用：

    1
    ![](/images/my-photo.jpg)

特点：

  • 简单直接，所有文章共享同一资源目录。
  • 适合资源数量少、结构简单的博客。

3. 文章资源文件夹（组织化方式）

适用场景：希望每篇文章拥有独立的资源文件夹，资源与文章一一对应，便于管理和迁移。

3.1 开启功能

在 _config.yml 中设置：

1
post_asset_folder: true

开启后，每次使用 hexo new [layout] <title> 创建新文章时，Hexo 会自动在 source/_posts 下创建一个与文章同名的文件夹（不含扩展名）。例如：

1
hexo new "我的旅行"

会创建：

  • source/_posts/我的旅行.md
  • source/_posts/我的旅行/ （资源文件夹）

3.2 使用 Markdown 原生语法嵌入图片（高级）

配置方法（在 _config.yml 中）：

1
2
3
4
post_asset_folder: true
marked:
  prependRoot: true      # 是否在图片路径前添加根路径
  postAsset: true        # 是否启用文章资源自动解析

效果：假设文章是 source/_posts/hello.md，同名资源文件夹hello下有一张 image.jpg，则在 Markdown 中写：

1
![](image.jpg)

会被自动解析为：

1
<img src=".../image.jpg">

2.4 服务器

1. 安装服务器模块

Hexo 自 3.0 版本起，将服务器功能独立为一个单独的模块，需要手动安装才能使用。

安装命令：

1
npm install hexo-server --save
  • --save 会将依赖写入 package.json，便于项目迁移后重新安装。

2. 启动服务器

安装完成后，在项目根目录下执行：

1
2
3
hexo server
# 简写：
hexo s
  • 自动监视文件变化：服务器启动期间，Hexo 会监听源文件（文章、主题、配置等）的变动，并自动重新生成和刷新页面，无需手动重启服务器。非常适合本地写作和调试。

2.5 生成文件

1
2
3
hexo generate
# 简写形式：
hexo g

该命令会读取 source 文件夹中的内容（Markdown 文章、页面、资源等），经过渲染后输出到 public 文件夹。生成的 public 文件夹就是完整的静态网站，可以直接部署到任何 Web 服务器。