Shaw
0%

Hexo-文件目录结构

Posted on Edited on In

目录结构一览

以下结构树显示了 Hexo 文件目录的结构，分析深度为两层：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
Blog
├─ .deploy_git
├─ .github
├─ node_modules
├─ public
│    ├─ 2021
│    ├─ 2022
│    ├─ about
│    ├─ archives
│    ├─ categories
│    ├─ css
│    ├─ images
│    ├─ index.html
│    ├─ js
│    ├─ lib
│    ├─ page
│    ├─ resources
│    ├─ schedule
│    └─ tags
├─ scaffolds
│    ├─ draft.md
│    ├─ page.md
│    └─ post.md
├─ source
│    ├─ _drafts
│    ├─ _posts
│    ├─ about
│    ├─ categories
│    ├─ resources
│    ├─ schedule
│    └─ tags
├─ themes
│    └─ next
├─ .gitignore
├─ _config.landscape.yml
├─ _config.yml
├─ db.json
├─ package.json
└─ package-lock.json

.deploy_git

此目录中的内容 = GitHub 站点中对于repository中的内容 = 最近一次上传到站点的 public 目录中的内容

在输入 hexo d 部署到 GitHub 后自动创建。该目录的结构和 public 目录基本一致（不一致的情况是由于重新生成，但是没有发布站点造成，此时 public 内容新于 .deploy_git 内容）

回忆发布站点时按顺序使用的三个命令

1
hexo clean && hexo g && hexo d

当使用 hexo g 后 public 中的内容已更新，确实是新于 .deploy_git 内容

node_modules

存放安装的 Hexo 扩展，都是相应的 node 依赖模块

public

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
public
├─ 2021
├─ 2022
├─ about
├─ archives
├─ categories
├─ css
├─ images
├─ index.html
├─ js
├─ lib
├─ page
├─ resources
├─ schedule
└─ tags

在执行 hexo g 命令时，Hexo 程序会编译 source、theme 目录，生成的静态网页内容目录就是 piblic

生成好的 public 文件夹内容就可以直接当成静态网站进行部署

在执行 hexo d 命令时，会将 piblic 目录内容复制到 .deploy_git 目录

值得注意的是，（作为刚刚接触的新手，）你可能尝试在 public 文件夹通过修改 css 来更改网站某些元素的样式，但是当你重新生成静态网页进行部署时，会发现样式修改并不起作用。这究竟是为什么呢？这个问题的答案我们留到后面再解答。

scaffolds

1
2
3
4
scaffolds
├─ draft.md
├─ page.md
└─ post.md

scaffolds 是“脚手架、骨架”的意思，当你新建一篇文章（hexo new 'post-title'）的时候，Hexo 是根据这个目录下的文件进行构建的

source

1
2
3
4
5
6
7
8
source
├─ _drafts
├─ _posts
├─ about
├─ categories
├─ resources
├─ schedule
└─ tags

存放用户资源的地方

_posts

存放博客文章的地方，其中的 markdown 文件、HTML 文件、org 文件等会被解析并放到 public 文件夹，发布到站点

其它以 _（下划线）开头的文件 / 文件夹

将会被忽略。因此可以在 source 目录下创建 _drafts 目录用于存放未完成的草稿，其中内容不会发布到网站

其它非 _ 开头的文件 / 文件夹

会被拷贝到 public 目录并上传到站点。

  • 可以创建 img 目录来存放在博客引用到的图片等

  • 要添加新的页面（例如 about），执行 hexo new page PageName 命令即会在 source 中自动新建子目录 PageName

  • favicon.ico 在主题配置文件中引用 /favicon.ico 来设置站点的页面图标

themes

1
2
3
themes
├─ .gitkeep
└─ next

网站的主题目录。默认安装 landscape 主题，你可以安装新主题到 themes 目录，也可以自己新建主题

前面提到如果你需要自定义网站 css，你不应该在 public 目录进行修改。事实上，你应该在 theme 目录下进行修改

在下一篇博客中，我们将会提到主题目录 theme 的结构，其中资源文件夹 source 包含了除了模板以外的资源，例如 CSS,JavaScript 文件等。如果文件可以被渲染的话，会经过解析然后储存到 public 文件夹，否则会直接拷贝到 public 文件夹。由此可以发现，单纯修改 public 并不能真正改变 css，因为它会在下一次生成静态网站时，被 ...\theme\next\source 下的文件解析或直接拷贝所覆盖

_config.yml

全局配置文件，网站的很多信息都在这里配置，诸如网站名称，副标题，描述，作者，语言，主题，部署等等参数。具体设置参见 配置 | Hexo

db.json

自动生成的一个文件 JSON 文件

应用程序的信息。可以查看Hexo 的版本以及安装的扩展版本，可以对博客的文件进行管理查找的

package.json

Hexo 框架的参数和所有依赖的插件

Reference

  1. 文件目录结构可视化方法：Dir Tree Noter

    将目录拖动到指定位置即可显示，可以调节可见的深度

  2. Hexo 搭建个人博客 #03 框架的基本结构与打包后的文件介绍 | 杨斌的博客

  3. Hexo 目录结构小探 | 跬步

  4. Hexo 的目录结构及作用 | 浪花一朵朵