Shaw
0%

Hexo theme 目录结构

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
themes
├─ .gitkeep
└─ next
       ├─ .github
       ├─ docs
       ├─ languages
       ├─ layout
       ├─ scripts
       ├─ source
       ├─ .editorconfig
       ├─ .eslintrc.json
       ├─ .gitattributes
       ├─ .gitignore
       ├─ .stylintrc
       ├─ .travis.yml
       ├─ _config.yml
       ├─ crowdin.yml
       ├─ gulpfile.js
       ├─ LICENSE.md
       ├─ package.json
       └─ README.md

_config.yml

主题的配置文件

languages

语言文件夹。根据 Hexo 目录中 _config.yml 设置的语言来选择站点以哪种语言来呈现

layout

存放主题的模板文件，决定了网站内容的呈现方式

Hexo 根据模板文件的扩展名来决定所使用的模板引擎，例如：

  • layout.ejs - 使用 EJS
  • layout.swig - 使用 Swig

更多参见：

scripts

脚本文件夹。在启动时，Hexo 会载入此文件夹内的 JavaScript 文件。

Hexo 有强大的插件系统，使您能轻松扩展功能而不用修改核心模块的源码。在 Hexo 中有两种形式的插件：

脚本（Scripts）

如果您的代码很简单，建议您编写脚本，您只需要把 JavaScript 文件放到 scripts 文件夹，在启动时就会自动载入。

插件（Packages）

如果您的代码较复杂，或是您想要发布到 NPM 上，建议您编写插件。首先，在 node_modules 文件夹中建立文件夹，文件夹名称开头必须为 hexo-，如此一来 Hexo 才会在启动时载入；否则 Hexo 将会忽略它。

文件夹内至少要包含 2 个文件：一个是主程序，另一个是 package.json，描述插件的用途和所依赖的插件。

1
2
3
.
├── index.js
└── package.json

package.json 中至少要包含 name, version, main 属性，例如：

1
2
3
4
5
package.json{
  "name": "hexo-my-plugin",
  "version": "0.0.1",
  "main": "index"
}

更多参见 插件 | Hexo

source

1
2
3
4
5
source
├─ css
├─ images
├─ js
└─ lib

资源文件夹，除了模板以外的资源，例如 CSS、JavaScript 文件等，都应该放在这个文件夹中。

文件或文件夹开头名称为 _（下划线）或隐藏的文件会被忽略。

如果文件可以被渲染的话，会经过解析然后储存到 public 文件夹，否则会直接拷贝到 public 文件夹

css

1
2
3
4
5
6
7
css
├─ _common
├─ _schemes
├─ _variables
├─ _colors.styl
├─ _mixins.styl
└─ main.styl

如果想自定义CSS，主要修改2个地方：

  1. _variables
  2. _common
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
css
├─ _common
│    ├─ components
│    ├─ outline
│    └─ scaffolding
├─ _schemes
│    ├─ Gemini
│    ├─ Mist
│    ├─ Muse
│    └─ Pisces
├─ _variables
│    ├─ Gemini.styl
│    ├─ Mist.styl
│    ├─ Muse.styl
│    ├─ Pisces.styl
│    └─ base.styl
├─ _colors.styl
├─ _mixins.styl
└─ main.styl