基于hexo搭建博客&使用minimalism主题

搭建博客&使用主题

确认本地有Node.js环境，我的版本是v22.17.0，minimalism主题官方文档要求node版本在大于v18

node -v

本地全局安装hexo-cli命令行工具

1	npm install -g hexo-cli

初始化博客目录，YOUR_BLOG_NAME替换为hexo博客目录名称

1	hexo init YOUR_BLOG_NAME

博客目录中启动本地服务器，在localhost:4000预览博客

1	hexo server

默认主题是landscape，够用但不够美观。可以学习基本前端知识和ejs语法自己编写hexo博客主题，也可以直接从官方主题市场下载并使用别人的主题：

Themes | Hexo

推荐minimalism主题，直接看官方文档：

主题介绍 | Minimalism 文档

将主题目录git clone到hexo目录的theme/目录

1	git clone https://github.com/f-dong/hexo-theme-minimalism.git themes/minimalism

将hexo配置文件中的theme字段值更改为minimalism

1	hexo config theme minimalism

主题相关细节参照官方文档配置。

minimalism常用配置

page

tags页面，细分查找文章

1	hexo new page "tags"

---
title: TAGS
type: "tags"
layout: "tags"
---

categories页面，大致地对文章进行分类

1	hexo new page "categories"

---
title: CATEGORIES
type: "categories"
layout: "categories"
---

active归档页面（一般来说是archive），按时间顺序对文章进行归类

1	hexo new page "active"

---
title: ACTIVE
type: "active"
layout: "active"
---

front-matter

front-matter就是文章的各种元信息，比如title、tags这种。这里给出最全示例

---
title: typora-vue-theme主题介绍
date: 2022-04-26 09:25:00
author: 张三
img: /source/images/xxx.jpg
top: true
hide: false
cover: true
toc: false
summary: 这是你自定义的文章摘要内容，如果这个属性有值，文章卡片摘要就显示这段文字，否则程序会自动截取文章的部分内容作为摘要
description: 该值主要用于 seo 优化，设置后页面 description 将显示该值，未设置则取 summary 或截取部分文章内容
categories: Markdown
tags:
  - Typora
  - Markdown
---

部署到GitHub Pages

在hexo目录中添加git部署所需的库

1	npm install hexo-deployer-git --save

修改hexo配置文件末尾处的deploy选项

deploy:
  type: git
  repo: git@github.com:chisakae/chisakae.github.io.git
  branch: main

现在的GitHub仓库默认分支为main分支，很多初学者看老教程使用master分支可能出现问题。至于GitHub为什么更改默认分支名称呢，因为master这个词汇存在潜在的歧视意味，所以官方对此进行了更改

依次执行下列三个命令。clean用于清理public/目录，避免旧文件残留

1	hexo clean

generate用于根据markdown文档构建项目，构建产物存在public目录

1	hexo generate

deploy用于部署，将项目推送到远程仓库，此处是GitHub仓库

hexo d

如果你在本地使用了代理软件，在推送时可能出现拒绝连接和连接超时的问题，建议关闭代理后再推送

ruriai