一、Hexo
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
| # 准备工作：安装NodeJS
# 全局安装Hexo
npm install -g hexo-cli# 初始化Hexo项目
hexo init hexo-blog
cd hexo-blog # 查看目录结构
tree -L 1
.
├── _config.landscape.yml
├── _config.yml # 配置，比如之后在该文件配置github账号
├── node_modules
├── package-lock.json
├── package.json
├── scaffolds
├── source # source/_posts 存放博客文件（Markdown格式）
└── themes # 更改博客主题皮肤 # 常用Hexo命令
hexo init [folder] # 初始化
hexo new [layout] <title> # 新建文章
hexo generate # 生成静态文件，根目录生成public文件夹
hexo server # 启动本地服务器，http://localhost:4000/
hexo deploy # 部署到远程 (hexo -g d 生成静态文件并部署)
hexo clean # 清除缓存文件 (db.json) 和已生成的静态文件 (public)
|
更换主题
官网提供了多种可选主题 Themes | Hexo
选择某个主题下载压缩包，以 Fluid 主题为例，在 GitHub 中下载 Releases 包并解压，重命名为 fluid 放在 themes 目录下。
更改 _config.yml
1
2
| theme: fluid # 指定主题
language: zh-CN # 指定主题显示语言
|
新建文章
1
2
3
4
5
6
7
8
9
10
11
| # 新建
hexo new my-blog # hexo new post my-blog 指定layout# 查看变化
tree source/_posts
source/_posts
├── hello-world.md
└── my-blog.md # 写入内容后本地测试
hexo s
|
通过 new 命令可以在 source/_posts 文件夹下创建相应的 Markdown 文件。
通常需要在文章中插入图片，为了更规律的管理文章的图片，为每篇文章准备相对应的资源文件夹，将 _config.yml 文件中的 post_asset_folder 选项设为 true 后，创建新文章时自动创建一个同名资源文件夹。
为了使用 Markdown 引用图片，继续改动 _config.yml。
1
2
3
4
| post_asset_folder: true
marked:
prependRoot: true
postAsset: true
|
之后可以在文章中直接通过  引用对应的图片。
通过更改主题的 _config.yml 文件可以实现个性化，比如改变主页某处的文字、增加阅读量记录、增加评论功能等，可以根据主题相应的文档进行更改。可以注册 LeanCloud，使用其统计服务等功能。
二、Github Pages
在 Hexo 项目中安装 hexo-deployer-git 包。
1
| npm install hexo-deployer-git --save
|
新建仓库，仓库名格式为 <用户名>.github.io ；在 _config.yml 中配置 GitHub 的相关信息。token 可以在 github 的 Settings/Developer Settings 中生成。
1
2
3
4
5
| deploy:
type: git
repository: [email protected]:kaysonyu/kaysonyu.github.io.git
branch: master
token: xxx
|
部署到 github
其他相关：Netlify，Vercel，CF Pages
参考：
- Hexo 中文文档
- GitHub Pages + Hexo搭建个人博客网站，史上最全教程_hexo博客-CSDN博客
- 配置指南 | Hexo Fluid 用户手册 (fluid-dev.com)
