Hexo 开始使用(一)
1.Hexo 开始使用
1.1 简介
1. 什么是 Hexo
Hexo 是一个快速、简洁、高效博客框架。
你只需用 Markdown 格式写文章,Hexo 就能在几秒内生成漂亮的静态网页,不需要复杂的后台配置。
2. 安装前的准备条件
要安装 Hexo,必须先装好 Node.js 与 Git
为了不出问题,强烈建议安装最新版 Hexo 和推荐的 Node.js 版本。
3. 安装 Hexo
1 | |
这条命令会全局安装 hexo 命令,之后就可以在任何地方使用。
1.2 建站
1. 初始化 Hexo 项目
1 | |
2. 项目文件夹结构概览
初始化后的项目目录结构如下:
1 | |
3. 核心配置与依赖文件
3.1 _config.yml
- 作用:网站的配置文件,位于项目根目录
3.2 package.json
作用:记录项目信息和依赖包列表
默认包含:
- Hexo 核心包 (
hexo) - 生成器:归档 (
hexo-generator-archive)、分类 (hexo-generator-category)、首页 (hexo-generator-index)、标签 (hexo-generator-tag) - 渲染器:EJS、Stylus、Markdown (
hexo-renderer-ejs,hexo-renderer-stylus,hexo-renderer-marked) - 本地服务器 (
hexo-server) - 默认主题 (
hexo-theme-landscape)
- Hexo 核心包 (
注意:你可以自由移除不需要的依赖,稍后也可以卸载它们。EJS、Stylus 和 Markdown 渲染引擎默认已安装。
4. 模板文件夹 (scaffolds)
- 作用:存放文章模板。当你使用
hexo new命令创建新文章时,Hexo 会根据这里的模板文件自动生成文章的初始内容。 - 常见模板:默认有
post.md、draft.md、page.md等,可以自定义修改。
5. 资源文件夹 (source)
作用:存放用户的所有原始内容,包括文章、页面、图片等。
子目录说明:
_posts:存放正式发布的文章(Markdown 或 HTML 文件会被解析并生成到public文件夹)。_drafts:存放草稿,默认不会被发布。
重要规则:除了
_posts文件夹外,任何以下划线开头的文件或文件夹(以及隐藏文件)都会被 Hexo 忽略,不会处理。文件处理方式:
- Markdown 和 HTML 文件 → 解析后放入
public文件夹 - 其他文件(如图片、CSS、JS 等)→ 直接拷贝到
public文件夹
- Markdown 和 HTML 文件 → 解析后放入
6. 主题文件夹 (themes)
- 作用:存放博客主题。Hexo 根据选定的主题来生成静态页面的外观和布局。
- 默认主题:
landscape(由package.json中的hexo-theme-landscape提供) - 更换主题:可以下载第三方主题放到
themes目录,然后在_config.yml中修改theme设置。
1.3 配置
1. 配置文件概述
Hexo 的大部分配置都在项目根目录下的 _config.yml 文件中修改。以下按配置项类别整理。
2. 网站基本设置
| 配置项 | 说明 |
|---|---|
title |
网站标题 |
subtitle |
网站副标题 |
description |
网站描述 |
keywords |
网站关键词,支持多个 |
author |
作者名称 |
language |
网站语言。使用两位的 ISO-639-1 代码(或变体)。默认 en,建议设置 zh-CN |
timezone |
网站时区。默认使用电脑时区。中国大陆常用 Asia/Shanghai。 |
3. 网址设置
| 配置项 | 说明 | 默认值 |
|---|---|---|
url |
网站完整网址,必须以 http:// 或 https:// 开头 |
无 |
root |
网站根目录 | url 的路径部分 |
permalink |
文章的永久链接格式 | :year/:month/:day/:title/ |
permalink_defaults |
永久链接中各部分的默认值 | 无 |
pretty_urls.trailing_index |
是否在永久链接中保留末尾的 index.html。设为 false 则去除 |
true |
pretty_urls.trailing_html |
是否在永久链接中保留末尾的 .html(对末尾 index.html 无效) |
true |
重要:如果网站放在子目录(如 http://example.com/blog),需要将 url 设为 http://example.com/blog,并把 root 设为 /blog/。
4. 目录设置
| 配置项 | 说明 | 默认值 |
|---|---|---|
source_dir |
资源文件夹(存放内容) | source |
public_dir |
生成静态站点的文件夹 | public |
tag_dir |
标签文件夹 | tags |
archive_dir |
归档文件夹 | archives |
category_dir |
分类文件夹 | categories |
code_dir |
代码嵌入文件夹(在 source_dir 下) |
downloads/code |
i18n_dir |
国际化文件夹 | :lang |
skip_render |
匹配到的文件直接复制到 public,不渲染。支持 glob 表达式 |
无 |
5. 文章设置
| 配置项 | 说明 | 默认值 |
|---|---|---|
new_post_name |
新建文章时的文件名格式 | :title.md |
default_layout |
新建文章默认使用的布局 | post |
titlecase |
是否将标题转换为首字母大写 | false |
external_link.enable |
是否在新标签页中打开外部链接 | true |
external_link.field |
应用范围:site(全站)或 post(仅文章) |
site |
external_link.exclude |
排除的域名(主域名和子域名需分别填写) | [] |
filename_case |
文件名大小写转换。1 转小写,2 转大写 |
0 |
render_drafts |
是否生成草稿(source/_drafts 中的文章) |
false |
post_asset_folder |
是否启用资源文件夹(为每篇文章创建同名文件夹) | false |
relative_link |
是否使用相对路径链接 | false |
future |
是否显示未来日期的文章 | true |
syntax_highlighter |
代码高亮设置(highlight.js 或 prismjs) |
highlight.js |
highlight |
Highlight.js 的详细设置 | 参考文档 |
prismjs |
PrismJS 的详细设置 | 参考文档 |
6. 首页设置
| 配置项 | 说明 | 默认值 |
|---|---|---|
index_generator.path |
博客索引页面的根路径 | '' |
index_generator.per_page |
每页显示的文章数 | 10 |
index_generator.order_by |
排序方式(默认按日期降序,从新到旧) | -date |
index_generator.pagination_dir |
分页 URL 格式(例如 page) |
page |
7. 分类与标签设置
| 配置项 | 说明 | 默认值 |
|---|---|---|
default_category |
文章未指定分类时的默认分类 | uncategorized |
category_map |
分类别名映射(用于 URL) | 无 |
tag_map |
标签别名映射 | 无 |
8. 日期 / 时间格式
| 配置项 | 说明 | 默认值 |
|---|---|---|
date_format |
日期格式 | YYYY-MM-DD |
time_format |
时间格式 | HH:mm:ss |
updated_option |
当文章 Front Matter 中未指定 updated 时,updated 的取值方式 |
mtime |
updated_option 详解:
mtime:使用文件的最后修改时间(默认)date:使用date字段的值作为updatedempty:不设置updated字段(可能导致主题/插件异常)
9. 分页设置
| 配置项 | 说明 | 默认值 |
|---|---|---|
per_page |
每页显示文章数。设为 0 则关闭分页 |
10 |
pagination_dir |
分页 URL 的目录名(例如 page/2 中的 page) |
page |
10. 扩展设置
| 配置项 | 说明 |
|---|---|
theme |
当前使用的主题名称。设为 false 则禁用主题 |
theme_config |
主题的配置文件。此处配置会覆盖主题目录下的 _config.yml |
deploy |
部署相关的设置(如 Git、FTP 等) |
meta_generator |
是否在页面头部插入 <meta name="generator" content="Hexo">。设为 false 则不插入 |
1.4 命令
| 命令 | 语法 | 说明 | 备注 |
|---|---|---|---|
init |
hexo init [folder] |
新建一个 Hexo 网站 | |
new |
hexo new [layout] <title> |
新建一篇文章或页面。 | title 不可省略 |
hexo new page --path about/me "关于我" |
在 source/about/me.md 生成文件,Front Matter 中 title 为“关于我”。 |
||
generate |
hexo generate 或 hexo g |
生成静态网站文件。 | |
server |
hexo server 或 hexo s |
启动本地预览服务器。写作过程中的实时预览。修改文件后,服务器会自动刷新(需配合 generate --watch 或依赖热更新) |
|
deploy |
hexo deploy 或 hexo d |
将生成的静态文件部署到远程服务器。 | |
clean |
hexo clean |
清理缓存和生成的文件(public 目录)。 | |
version |
hexo version 或 hexo v |
显示 Hexo 版本信息。 | |
config |
hexo config [key] [value] |
查看或修改配置项。 |